0

Web サイトを表示する前にすべての画像をダウンロードするプリローダーを作成したかったのですが、後で<img>CSS スタイルのul-s に切り替える必要があり、その後動作を停止しました。ブラウザーは画像の読み込みを待機しません。

HTML:

<head>
[...]
<ul id="imgPreLoader">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
</ul>
[...]
</head>

CSS :

#imgPreLoader {
display:none;
}

#imgPreLoader li:nth-child(1) {
background-image: url('...');
}

#imgPreLoader li:nth-child(2) {
background-image: url('...');

}

#imgPreLoader li:nth-child(3) {
background-image: url('...');

}

#imgPreLoader li:nth-child(4) {
background-image: url('...');

}
4

2 に答える 2

0

これは、設定したことが原因である可能性がありますdisplay:none。表示されていない img 要素のソースをロードしても、display が none の場合、多くのブラウザは背景画像をロードしないと思います。

を設定する代わりにdisplay:none、次のようにしてみてください。

#imgPreLoader {
   visibility:hidden;
   position:fixed;
}

これは、要素が表示されてレイアウトに影響を与えるのを防ぐという点で同じことを達成する必要がありますが、ブラウザに背景画像を読み込ませる必要があります。

于 2013-08-26T13:52:23.887 に答える