How to set random switching background images in js-JS Tutorial-php.cn

How to set random switching background images in js

小云云

Release： 2018-05-26 10:24:28

Original

5443 people have browsed it

A perfect web page, in addition to HTML and CSS, JavaScript also plays an important role. In this article, we will share with you a little trick, a simple example of js setting to randomly switch background images.

<script>
   
var imgs =["http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_2.jpg",
       "http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_default.png",
       "http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_3.jpg",
       "http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_1.jpg",
       "http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_4.jpg",
       "http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_5.jpg",
       "http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_6.jpg",
       "http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_default-2.jpg",
       ];  
   
var index=Math.floor(Math.random()*8);
var img = imgs[index];
    function time(){
          
       document.body.style.backgroundImage="url("+img+")";
          
    }  
   
document.body.onload = function(){
 time();
}
</script>

Copy after login

The above content is a simple example of js setting to randomly switch background images. I hope it can help everyone.

Related recommendations:

Detailed explanation of examples of background image settings in css

CSS+html detailed explanation of how to implement background image filling

Summary of common methods for adding background images to buttons in js

The above is the detailed content of How to set random switching background images in js. For more information, please follow other related articles on the PHP Chinese website!