想让改变背景像褪色一样顺利

Question

我花了很多天试图弄清楚如何为背景图像过渡设置动画，但我找不到解决方案。我是网络开发新手，所以请不要苛刻;)

这是我从其他人那里得到的一些示例代码：

var images = ['bg1.jpg', 'bg2.jpg', 'bg3.jpg'];
var curImage = 0;
function switchImage()
{
curImage = (curImage + 1) % images.length
document.body.style.backgroundImage = 'url(images/' + images[curImage] + ')'
}
window.setInterval(switchImage, 5000);

此代码立即更改背景图像，但我希望新的背景图像淡入。

这是该页面的链接我正在创建：

http://preferredmerchantservices.net/

我希望有人可以帮助我，并提前致谢。

Answer 1

看看这个问题：

背景图像淡入淡出

这是一个解释的链接如何使用 jQuery 进行淡入淡出过渡：

http://jqueryfordesigners.com/image-loading/

如果您需要 jQuery 库，可以将此代码粘贴到您的页面中：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>

Answer 2

如果您不想浪费太多时间来弄清楚自己，您应该使用 jQuery 等库。这样就只剩下 fadeIn() 和 fadeOut() 的问题了。

由于您是 Web 开发的新手，您必须知道 jQuery 是一个非常流行的库，现在几乎每个人都在使用。它可以让您编写更少的代码并执行更多操作。

但最重要的是，它确保了跨浏览器兼容性。