0

こんにちは、以下は、30 秒ごとに背景画像を変更するための私の JS コードです。画像をブラウザーウィンドウに合わせて (100%) コードを変更する方法があるかどうか、また、このコード内で使用して画像をシームレスにフェードインおよびフェードアウトさせる JS があるかどうかを教えてください。エレガントに。

<script>
bgArr = ['images/bg1.jpg', 'images/bg2.jpg', 'images/bg3.jpg'];
bgCur = 0;
backgroundSwitch = function()
{
if (bgCur == bgArr.length) bgCur = 0;
document.body.style.backgroundImage = 'url('+ bgArr[bgCur++]+ ')';
}
window.setInterval(backgroundSwitch, 30000); // Switch every 30 seconds.
</script>

みんなありがとう

4

2 に答える 2

1

CSS3導入background-size: cover。これにより、親要素全体をカバーするように背景画像のサイズが自動的に調整され、水平方向または垂直方向に拡大縮小されていっぱいになります。

MDNのエントリを参照してください。

background-sizeすべての主要なブラウザでサポートされています。

于 2014-01-18T20:38:44.887 に答える