1. Use JS to define an image array, which stores the pictures you want to display randomly
The code copy is as follows:
ar imgArr=["//www.VeVB.COM/logo_cn.png",
"//www.VeVB.COM/baidu_sylogo1.gif",
"//www.VeVB.COM/news/uploadImg/20120111/20120111081906_79.jpg",
"//www.VeVB.COM/news/uploadImg/20120111/20120111081906_76.jpg"];
Please change the picture above to your own.
2. Use JS to generate a random number, of course, this random number starts from 0 and ends from imgArr.length-1.
The code copy is as follows:
var index =parseInt(Math.random()*(imgArr.length-1));
This way we get the currently randomly generated image
The code copy is as follows:
var currentImage=imgArr[index];
3. Since a background image was randomly generated, use JS to use this image as the background image.
The code copy is as follows:
document.getElementById("BackgroundArea").style.backgroundImage="url("+currentImage+")";
Since this is a demo, I defined a div with the id of BackgroundArea on the page, and also set a random background for this div.
The code copy is as follows:
<div id="BackgroundArea">
</div>