Question

我在测试网站上遇到了jquery css3背景图片滚动条的问题。它工作正常，除了我无法弄清楚为什么它在切换图像前的前几秒显示一个空白的白色屏幕。我希望它只是启动显示图像，然后滚动浏览其余图像，而不是从白色开始并滚动图像。

HTML

<div id="imgscroll">
<img src="images/bg/bg_1.jpg" />
<img src="images/bg/bg_2.jpg" />
<img src="images/bg/bg_3.jpg" />
<img src="images/bg/bg_4.jpg" />
<img src="images/bg/bg_5.jpg" />
</div>

CSS

#imgscroll {
width: 100%;
height: 100vh;
}
#imgscroll img {
position:absolute;
top:0;
display:none;
width:100%;
height:100vh;
z-index: -3;
}

JS

$('img').hide();
function test() {
$("#imgscroll img").first().fadeIn(2500);
$("#imgscroll img").first().appendTo('#imgscroll').fadeOut(2500);
setTimeout(test, 5000);
}
test();

Answer 1

可能是因为你每次都褪色和褪色2.5秒：

$("#imgscroll img").first().fadeIn(2500);
$("#imgscroll img").first().appendTo('#imgscroll').fadeOut(2500);

尝试删除这2行^

Answer 2

尝试将其更改为50而不是2500

jquery图像滚动条开始白色

2 个答案: