Question

好的，所以我要展示的完整示例不再在线，所以我将不得不尝试解释。

我尝试做的是将循环视频作为全屏幕背景，其中包含一个DIV，其中包含一个在屏幕上来回缓慢移动的视频。

这是动画部分的一个例子，但它太快了：

HTML CODE

<div style='position:absolute; background-color: blue; height: 50px; width:50px;'></div>

JS CODE

setInterval(function(){
    $("div").stop(true,true).animate({left: 300}, 10000, 
          function(){ $(this).stop(true,true).animate({left: 0}, 1000); 
    });
}, 20000);

我对javascript不是很好，所以也许有人可以帮我弄清楚时间方面。

谢谢！

Answer 1

animate函数中的第二个参数是动画的持续时间，它决定了动画的持续时间。现在它是1000，即1000毫秒，或1秒。使该数字更大，使其移动更慢。但是，setInterval会杀死你，它会停止它并在2秒后再次调用它，因此需要将该数字更改为两个持续时间的总和。但是，这将是您需要等待动画开始的时间。 See how that is working here.如果你想让动画永远在循环中继续，你可以这样做： http://jsfiddle.net/bypepLf9/1/

请记住，您正在执行两个单独的动画，一个在右侧，另一个在左侧，并且它们可以在完成时相互调用，因为最后一个参数是在动画完成时将调用的回调。 / p>

以下是jQuery animate docs：http://api.jquery.com/animate/，但这也应该可以通过纯CSS完成。

如何移动DIV; Forth SLOWLY Overtop背景？

1 个答案: