87,910
社区成员
发帖
与我相关
我的任务
分享
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<div id='a' style="position:absolute;left:10px;top:10px;width:200px;height:120px;background:#f0f">0</div>
<div id='b' style="position:absolute;left:100px;top:200px;width:200px;height:120px;background:#0ff">0</div>
<script type="text/javascript">
$(document).ready(function() {
var alist = {};
var atimer = null;
$(document).keydown(function(e) {
action(e.keyCode, 'move');
}).keyup(function(e) {
action(e.keyCode, 'stop');
});
function action(k, act) {
if(k == 65 || k == 66) {
if(act == 'move') {
alist[k] = k == 65? '#a' : '#b';
if(!atimer) {
atimer = setInterval(function() {
$.each(alist, function(i, v) {
if(v) {
$(v).css('left', ($(v).position().left + 10));
}
});
}, 20);
}
} else {
alist[k] = null;
if($.isEmptyObject(alist)) {
clearInterval(atimer);
atimer = null;
}
}
}
}
});
</script>
</body>
</html>
$(function(){
var move={
a:function(){
$("#zd").animate({left:"+=1px"},15);
},
b: function(){
$("#zd1").animate({left:"+=1px"},15);
}
};
jQuery(document).bind('keydown', 'a',function (evt){
move.a();
}).bind('keydown', 'b',function (evt){
move.b();
});
});