-1

我需要一些动画方面的帮助。我试图让 div1、div2 和 div3 向右滑动，而 div4、div5 和 div6 向左滑动。目前我似乎无法将两者分开，而且似乎都朝着同一个方向滑动。我是 jQuery 新手，刚刚学习，任何帮助将不胜感激！这是我的代码：

<script> 

var animateMe = function(targetElement, speed){
$(targetElement).css({left:'-200px'});
$(targetElement).animate(
    {
    'left': $(document).width() 
    },
    {
    duration: speed,
    complete: function(){
        animateMe(this, speed);
        }
    }
 );
};

$(document).ready(function(){
animateMe($("#div1"), 15000);
animateMe($("#div2"), 13000);
animateMe($("#div3"), 14000);
});

var animateMe = function(targetElement, speed){

$(targetElement).css({right:'-200px'});
$(targetElement).animate(
    {
    'right': $(document).width() 
    },
    {
    duration: speed,
    complete: function(){
        animateMe(this, speed);
        }
    }
);
};

$(document).ready(function(){
animateMe($("#div4"), 16000);
animateMe($("#div5"), 14000);
animateMe($("#div6"), 13000);
});

</script>
4

1 回答 1

0

您可能遇到了竞争条件，您将animateMevar 设置为一个函数，然后重新设置它，然后在这两种情况发生后，使用第二个函数document.ready触发和动画所有元素。<div />animateMe

仅仅因为代码是自上而下读取的，并不意味着它会这样执行。您的代码几乎肯定会像这样执行：

[CREATE FUNCTION]
[OVERWRITE FUNCTION]
[ANIMATE 1, 2, 3]
[ANIMATE 4, 5, 6]

我建议您允许将参数传递给animateMe函数以使属性动画化，这样您就可以使用一个函数来动画化所有元素。

于 2013-11-13T17:24:32.290 回答