2

私はこの種のゲームを作っています。画面を「歩く」のはただの棒人間です。「上」を押すとジャンプを追加したいです。

これが私のコードです(ジャンプなし):

$(document).ready(function () {
            var sitting = $('#sitting'),
                image = $('#img');
            sitting.hide();
            $(document).keydown(function (e) {
                var keyCode = e.keyCode || e.which,
                    arrow = {
                        left: 37,
                        up: 38,
                        right: 39,
                        down: 40,
                        space: 32
                    };
                switch (keyCode) {
                case arrow.left:
                    if (!sitting.is(':visible')) {
                        image.add(sitting).stop(true).animate({
                            left: '-=60px'
                        }, 300, "linear");
                    }
                    break;
                case arrow.up:
                    break;
                case arrow.right:
                    if (!sitting.is(':visible')) {
                        image.add(sitting).stop(true).animate({
                            left: '+=60px'
                        }, 300, "linear");
                    }
                    break;
                case arrow.down:
                    break;
                case arrow.space:
                    image.fadeToggle(-100, function () {
                        sitting.fadeToggle(-100);
                    });
                    break;
                }
            });
            $('#sit').click(function () {});
        });

常識から、私はキューに入れられたアニメーションを使用してこれを行いました(これが唯一の関連部分であるため、大文字と小文字の矢印のみに切り詰めました):

case arrow.up:
                    if (!sitting.is(':visible')) {
                        image.animate({
                            top: '+=10px'
                        }, 200, "linear");
                        image.animate({
                            bottom: '+=10px'
                        }, 200, "linear");
                    }
                    break;

何らかの理由で、動作していません。なんてことだ。これがjsBinです

4

1 に答える 1

1

LIVE DEMO

var sitting = $('#sitting'),
    image = $('#img'), // COMMA HERE 
    jumping = false ;  // ADD THIS 

および変更:

    case arrow.up:
    if (!sitting.is(':visible') && jumping===false) {
        jumping = true;
        image.stop().animate({
            top: '-=150px'
        }, 200, "linear", function(){
          $(this).animate({top: '+=150'}, 300,'linear', function(){
             jumping = false;
          });                 
        });
    }
    break;
于 2013-02-05T01:46:09.457 に答える