3

問題は、背景画像のサイズが異なり、予測できないことです。そのため、CSS トランジションを使用するとストレッチがアニメーション化され、見た目が悪くなります。したがって、私は本当にJSでこれを行う必要があります。

var images = [
    "http://ns223506.ovh.net/rozne/e800637ee8c7de5cdaed8df8ea3635f1/wallpaper-2585508.jpg",
    "http://ns223506.ovh.net/rozne/15382371cb0d5b9319f5f4469bbc4511/wallpaper-2585497.jpg"
];

var counter = 0;
setInterval(function () {
    $(".bg").css('backgroundImage', 'url("' + images[counter] + '")');

    $('<img>').attr('src', images[++counter]); // preload the next image

    if (counter == images.length) counter = 0;

}, 2000);

http://jsfiddle.net/mVAvF/1/

私がやりたいのは、古い背景画像をフェードアウトしながら、新しい背景画像をフェードインすることです。助言がありますか?

4

1 に答える 1

2

同じ要素内である背景を別の背景にフェードすることはできません。現在の背景の上または後ろに別の要素を追加する必要があります。次に、新しい要素が上にある場合は新しい要素をフェードインするか、新しい要素が後ろにある場合は古い要素をフェードアウトします。

jsFiddle: jQuery background image rotation script - looking to modifyを含む前に、同様の質問に答えました

于 2013-02-22T14:00:37.840 に答える