0

一定の間隔ごとに画像を変更するコードがありますが、この画像は通常どおり変更されています。コードにフェードアウトオプションを使用して、新しい画像を開くためにゆっくりとフェードアウトするようにするにはどうすればよいですか。私のコードは次のとおりです

$(document).ready(function() {
        (function() {
            var curImgId = 0;
            var numberOfImages = 2;
            window.setInterval(function() {
                $('body').css('background-image','url(bg' + curImgId + '.jpg)');
                curImgId = (curImgId + 1) % numberOfImages;
            }, 15 * 100);
        })();
 });
4

3 に答える 3

1

背景画像をフェードすることはできません。要素をフェードすることしかできません(ただし、フェードするbodyとすべてのコンテンツもフェードします

あなたはそれを要素として追加し、それを他のすべての後ろに置く必要があります..そしてその要素をとでフェードし.fadeIn()ます.fadeOut()

于 2012-12-16T13:11:57.870 に答える
1

このスレッドを見ることができます:
CSS3 background image transition
css を使用した優れたソリューションです。

于 2012-12-16T13:25:45.643 に答える
0

要素の不透明度をゼロにフェードしてから、背景画像を変更してから、1にフェードバックすることができます。

$(document).ready(function() {
        (function() {
            var curImgId = 0;
            var numberOfImages = 2;
            window.setInterval(function() {
                $('body').fadeTo(500, 0, function(){
                    $(this).css('background-image','url(bg' + curImgId + '.jpg)');
                    $(this).fadeTo(500, 1);
                });
                curImgId = (curImgId + 1) % numberOfImages;
            }, 15 * 100);
        })();
 });
于 2012-12-16T13:17:04.193 に答える