用JS做一个div以键盘上下左右控制移动

JavaScript09

用JS做一个div以键盘上下左右控制移动,第1张

只走一步是因为移动一次后没有对x进行处理,所以点第二次的时候 x的值不变,x-10也不变,所以就不动了 <html><head><title>demo</title><style type="text/css">.active { border: 1px solid red} </style><script type="text/javascript" src="Scripts/jquery-1.6.2.min.js"></script><script type="text/javascript">var x = 0//水平方向位移 var y = 0//垂直方向位移 $(document).keydown(function (event) { switch (event.which) { case 37: y = y - 10$("#person").css("left", y + "px")breakcase 38: x = x - 10$("#person").css("top", x + "px")breakcase 39: y = y + 10$("#person").css("left", y + "px")breakcase 40: x = x + 10$("#person").css("top", x + "px")breakdefault: break} })</script></head><body><div id="person" class="active" style="position: absolutewidth: 50pxheight: 50px" /></body></html>

function showImg(index){

var adWidth = $(".content_right .ad").width()

$(".slider").stop(true,false).animate({left : -adWidth*index},1000)

$(".num li").removeClass("on")

.eq(index).addClass("on")

}

当然你也要调整样式的