javascript – 使用’.animate()’函数的功能问题

我正在使用CodeCademy上的jQuery课程,这个特定的任务涉及将switch函数与’.animate()’函数的多个实例结合使用.有问题的’img’是我们最喜欢的意大利水管工,但他只会向左移动.当我运行代码时,我收到此错误“

哎呀,再试一次.当您按“向右”时,您的图像看起来不会向右移动.“

$(document).ready(function() {
    $(document).keydown(function(key) {
        switch(parseInt(key.which,10)) {
            // Left arrow key pressed
            case 37:
                $('img').animate({left: "-=10px"}, 'fast');
                break;
            // Up Arrow Pressed
            case 38:
                $('img').animate({up: "-=10px"}, 'fast');
                break;
            // Right Arrow Pressed
            case 39:
            $('img').animate({right: "-=10px"}, 'fast');
                break;
            // Down Arrow Pressed
            case 40:
                $('img').animate({down: "-=10px"}, 'fast');
                break;
        }
    });
}); 

最佳答案

$(document).ready(function () {
    $(document).keydown(function (key) {
        switch (parseInt(key.which, 10)) {
            // Left arrow key pressed
            case 37:
                $('img').animate({left: "-=10px"}, 'fast');
                break;
                // Up Arrow Pressed
            case 38:
                $('img').animate({top: "-=10px"}, 'fast');
                break;
                // Right Arrow Pressed
            case 39:
                $('img').animate({left: "+=10px"}, 'fast');
                break;
                // Down Array Pressed
            case 40:
                $('img').animate({top: "+=10px"}, 'fast');
                break;
        }
    });
});

尝试使用left和top代替,否则你会被CSS恶魔困扰.谢谢,这有效,但不要反转上下! 🙂

点赞