Javascript div无法设置底面动画，并从每一面从窗口屏幕向外移动_Javascript_Jquery_Html_Css

Javascript div无法设置底面动画，并从每一面从窗口屏幕向外移动

javascript jquery html css

Javascript div无法设置底面动画，并从每一面从窗口屏幕向外移动,javascript,jquery,html,css,Javascript,Jquery,Html,Css,这适用于左、右和顶部动画div从左侧、右侧和顶部移动，但不适用于底部div无法移动底部。而且，当我快速按下按键超过十次或更多次时，它会从我的窗口屏幕的每一侧向外移动，如果我在一个动画结束后按下按键，它就不能从窗口的一侧向外移动 :) 我的html代码： <body> <div class="block"></div> </body> :) 我的jquery代码： $(window).load(function(e) { $("b

这适用于左、右和顶部动画div从左侧、右侧和顶部移动，但不适用于底部div无法移动底部。而且，当我快速按下按键超过十次或更多次时，它会从我的窗口屏幕的每一侧向外移动，如果我在一个动画结束后按下按键，它就不能从窗口的一侧向外移动

:)

我的html代码：

<body>
  <div class="block"></div>
</body>

:)

我的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');
        }
    }
 });
});

:)

$（窗口）。加载（函数（e）{
$（“正文”）.keydown（函数（e）{
var width1=$（窗口）.width（）；
var heigth1=$（窗口）.height（）；
如果（e.keyCode==37）{//left
如果（parseInt（$（'.block'）.css（'left'））>=50{
$（'.block'）.animate（{left:'-=50'}，“slow”）；
}
}
如果（e.keyCode==39）{//right
如果（parseInt（$（'.block'）.css（'left'））Typo
:)

应该是
var height1 = $(window).height();

:)

这是我的例子，希望我能帮助你：）
:)


:)

请把这个难看的“if else if else…”变成一个开关：D
开关盒的好处是什么代码是相同的开关盒和if else条件一样工作。对我和许多人来说，开关更容易阅读：）
是的，你是对的，这是我的错误，谢谢它解决了我的一个问题，但无法解决其他问题在JS中开发时，始终打开开发人员工具中的console选项卡。这将立即提醒您任何语法错误。虽然此链接可能会回答问题，但最好在此处包含答案的基本部分，并提供以下链接：参考。只有链接的答案可能会变得无效，如果链接页面的变化。我有一个糟糕的英语，所以我不能explain@AramMkrtchyan它工作正常，但不正常，它的工作，它也去外面的一些部分，不是一个完整的div。但现在还可以，谢谢。