0

これは、左、右、および上部のアニメーションdivが左側、右側、および上部から移動すると正常に機能しますが、下部のdivでは機能せず、下部を移動できません。また、キーを10回以上すばやく押すと、ウィンドウ画面から四方八方から外に出て、1つのアニメーションが終了した後にキーを押すと、外に出られません。

私の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');
        }
    }
 });
});
4

2 に答える 2

1

打ち間違え!

var heigth1 = $(window).height();

する必要があります

var height1 = $(window).height();
于 2013-10-18T10:09:28.903 に答える
1

私の例があります、私があなたを助けることを願っています:)

:)
于 2013-10-18T10:26:38.887 に答える