这与左,右和顶部动画div从左侧,右侧和顶侧移动正常工作,但不适用于底部div不能移动底部。而且当我按下按键十次或更多次时,它会从我的窗口屏幕的每一侧移出,并且如果我在完成一个动画后按下键,它就不会离开一侧。
我的html代码:
<body>
<div class="block"></div>
</body>
我的CSS代码:
div {
position: absolute;
background-color: #abc;
left: 50px;
top:50px;
width: 100px;
height: 100px;
}
我的jQuery代码:
$(window).load(function(e) {
$("body").keydown(function(e) {
var width1 = $(window).width();
var heigth1 = $(window).height();
if(e.keyCode == 37) { // left
if (parseInt($('.block').css('left')) >= 50) {
$('.block').animate({left: '-=50'},"slow");
}
}
else if(e.keyCode == 39) { // right
if (parseInt($('.block').css('left')) <= (width1 - 150)){
$(".block").animate({left: "+=50px"},'slow');
}
}
else if(e.keyCode == 40){ // bottom
if (parseInt($('.block').css('top')) <= (height1 - 150)) {
$(".block").animate({'top':'+=50px'},'slow');
}
}
else if(e.keyCode == 38){ // top
if (parseInt($('.block').css('top')) >= 50) {
$(".block").animate({'top':'-=50px'},'slow');
}
}
});
});
最佳答案
有我的例子,希望我能帮到你:)
example
:)
关于javascript - div无法对底部进行动画处理,并且从每一侧都从窗口屏幕移出,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/19446928/