1

背景画像をランダムに表示するこのコードがあります。読み込み速度を下げるために、画像のサイズを大きくし、バイト数を減らしました。ただし、画面サイズに関係なく画像のサイズを変更したいです。

<script type="text/javascript">
    var randnum = Math.random();
    var inum = 3;
    var rand1 = Math.round(randnum * (inum - 1)) + 1;
    images = new Array();
    images[1] = "bgImages/Blue_Venetian_Glass.jpg";
    images[2] = "bgImages/Etched Glass.jpg";
    images[3] = "bgImages/glass.jpg";
    images[4] = "bgImages/Raindrops_on_Glass.jpg";
    var image = images[rand1];
    document.body.style.background = 'url("' + image + '") no-repeat center center fixed';
</script>

私の質問は、「画像を伸ばすには何が必要ですか」です。

4

3 に答える 3

2

その効果を達成する最善の方法は、スタイルを設定できる絶対位置に画像を配置した div を使用することです。

の前に追加する HTML </body>:

<div align="center"><img src="images/BG.jpg" id="bg"></div>

CSS:

#bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -5000;
}

Javascript:

var randnum = Math.random();
var inum = 3;
var rand1 = Math.round(randnum * (inum - 1)) + 1;
images = new Array();
images[1] = "bgImages/Blue_Venetian_Glass.jpg";
images[2] = "bgImages/Etched Glass.jpg";
images[3] = "bgImages/glass.jpg";
images[4] = "bgImages/Raindrops_on_Glass.jpg";
var image = images[rand1];
document.getElementById('bg').src = image;
于 2012-09-25T15:58:11.493 に答える
2

CSS3background-sizeプロパティを使用できます。このリンクを確認してください。

http://www.w3schools.com/cssref/css3_pr_background-size.asp

于 2012-09-25T15:54:50.690 に答える
0

画像にcssクラスを与え、クラスの高さと幅の属性を100％に設定してみましたか？

于 2012-09-25T16:03:50.973 に答える