火柴人ios:jQuery动画火柴人跳(动画顶部 然后底部 )

我正在制作这种游戏,它只是一个在屏幕上“走动”的火柴人,如果你按下“向上”,我想在它上面加上跳跃。

这是我的代码(没有跳转):

$(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,因为它是唯一相关的部分):

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

由于某种原因,它不起作用。什么是如此。这是jsBin

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;

本站系公益性非盈利分享网址,本文来自用户投稿,不代表边看边学立场,如若转载,请注明出处

(131)
手机文件夹管理器:使用.bat使用文件资源管理器打开文件夹
上一篇
Ios免越狱资源站:Ios越狱-这是怎么发生的(kernelios)
下一篇

相关推荐

发表评论

登录 后才能评论

评论列表(60条)