Question

当用户加载我的页面时，我想让背景颜色为白色，然后在5秒后淡出颜色并淡入图片。 5秒后再次淡入另一张图片，这样您就可以在我的内容背后的背景中创建一种幻灯片放映。这就是我现在所拥有但不起作用的任何帮助吗？

$(document).ready(function() {
setTimout(function() {
    $('body').css("background-image","url('../img/background/1.jpg')").fadeIn(1000)
},5000);

function repeat() {
    $('body')
        .delay(5000).css("background-image","url('../img/background/2.jpg')").fadeIn(1000)
        .delay(5000).css("background-image","url('../img/background/3.jpg')").fadeIn(1000)
        .delay(5000).css("background-image","url('../img/background/1.jpg')").fadeIn(1000);
}
window.setInterval(repeat, 18000);
});

Answer 1

以下是语法错误：

setTimout(function() {
$('body').css("background-image","url('../img/background/1.jpg')").fadeIn(1000)
},5000);

应该是

setTimeout(function() {
$('body').css("background-image","url('../img/background/1.jpg')").fadeIn(1000)},5000);

缺少setTimeout

中的 e

我也不相信你能够淡化背景图像，除非你在DIV上设置它，除非你淡出身体。我已经将您的背景转换器重新编写为更少的代码行，这些代码行重复提供了一系列图像。这应该保持循环数组中的图像。

$(document).ready(function () {
                var images = ["../img/background/1.jpg", "../img/background/2.jpg"];
                var index = -1;

                window.setInterval(function () {
                    index = (index + 1 < images.length) ? index + 1 : 0;
                    $('body').css("background-image", "url('" + images[index] + "')");
                }, 5000);
            });

幻灯片背景标签

1 个答案: