0

ユーザーが私のページを読み込んだら、背景色を白にし、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);
});
4

1 に答える 1

0

構文エラーは次のとおりです。

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);
            });
于 2012-11-02T19:38:52.373 に答える