繁体   English   中英

每次加载网页时,如何使用JavaScript用新图像更改背景?

[英]How to change background with a new image using JavaScript when each time the web page is loaded?

我有一个在主体元素上附加了背景图像的网页,我想在每次加载窗口时使用新图像来更改背景,因此我编写了以下代码,但它不起作用,我无法弄清丢失的内容。

JS:

window.onload = function(){  
var bgdynamic = document.getElementById("bgdynamic");  
var imgarray = new Array("bgs/bg_01.jpg", "bgs/bg_02.jpg", "bgs/bg_03.jpg", "bgs/bg_04.jpg", "bgs/bg_05.jpg", "bgs/bg_06.jpg", "bgs/bg_07.jpg");  
var spot = Math.floor(Math.random()* imgarry.length);  
bgdynamic.style.backgroundImage="url("+imgarray[spot]+")";
};  

CSS:

body {
  background-image: url(bgs/bg_01.jpg);
  background-repeat: no-repeat;
  background-size:cover;

}

HTML:

<body id="bgdynamic">
Content goes...
</body>

您错过

var spot = Math.floor(Math.random()* imgarry.length);

应该 :

var spot = Math.floor(Math.random()* imgarray.length);`

jsfiddle

我认为您在使用Math.random()时遇到问题,我认为这应该可以解决此问题:

var spot = (Math.Random() * imgarray.length) * 10

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM