Question

使用Jquery我在我的网页上制作了一张幻灯片，其中包含背景图片。在CSS文件中，我设置图片以填充屏幕宽度。然后使用animate功能我将图片从右向左移动，并为每张图片添加适当的延迟。它工作得很好，但经过两三次循环，我开始看到图片之间的延迟，图片之间没有连续性，并且出现白色背景。等待的越多，情况就越糟糕。你知道这个问题的原因是什么吗？我该怎么办才能修好它？

以下是我为照片制作动画的方法：

if(value == 10){
nameOfTextfield.setText("0");
}

然后我为具有相同延迟的每张图片创建了相同的函数，之后我调用相同的函数来获取循环：

$(function() {

$('#picture2').delay(5000)
                  .animate({left: '0%'}, 1500)
                  .delay(5000)
                  .animate({left: '-100%'}, 1500)
                  .animate({opacity: '0'}, 1)
                  .animate({left: '100%'}, 1)
                  .animate({opacity: '1'}, 1);

$('#picture3').delay(11500)
                  .animate({left: '0%'}, 1500)
                  .delay(5000)
                  .animate({left: '-100%'}, 1500)
                  .animate({opacity: '0'}, 1)
                  .animate({left: '100%'}, 1)
                  .animate({opacity: '1'}, 1);

$('#picture4').delay(18000)
                  .animate({left: '0%'}, 1500)
                  .delay(5000)
                  .animate({left: '-100%'}, 1500)
                  .animate({opacity: '0'}, 1)
                  .animate({left: '100%'}, 1)
                  .animate({opacity: '1'}, 1);

提前感谢您的帮助。

Jquery - 图片幻灯片上的滞后

0 个答案: