Tag: cross fade

使用fadeIn（）循环显示背景图像

我正在制作一个带有一些视差图像的响应式网站，第一个图像是一个循环图像，就像一个图像滑块。 我正在使用jquery Cool小猫的响应能力。 我加载的相关jquery插件是： div的css是： #slide2 { background-image:url(../images/darkmap.png); height:700px; } 我发现在这种布局中使用HTML图像作为背景可能会有问题，这就是我通过使用数组避免这种情况的原因： var imageIndex = 0; var imagesArray = [ “images/photo1.png”, “images/photo2.png”, “images/photo3.png” ]; 我有一个包含在$(document).ready()函数中的代码，它将css背景更改为数组，然后循环遍历数组，我添加了fadeIn()以实现平滑过渡： function changeImage(){ var index = imageIndex++ % imagesArray.length; $(“#slide2”).css(“background”,”url(‘”+ imagesArray[index] +”‘)”); } setInterval(changeImage, 5000); changeImage.fadeIn(); 图像循环工作正常，但由于某种原因fadeIn()不起作用，它只是从一个图像闪烁到另一个图像。 有人可以告诉我我错过了什么吗？