jsでランダムに切り替わる背景画像を設定する方法

完璧な Web ページでは、HTML と CSS に加えて、JavaScript も重要な役割を果たします。この記事では、js 設定で背景画像をランダムに切り替える簡単な例を紹介します。

<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>

上記の内容は、jsでランダムに切り替わる背景画像を設定する簡単な例です。皆様のお役に立てれば幸いです。

関連おすすめ:

CSSで背景画像を設定する例を詳しく解説

CSS+html 背景画像の塗りつぶし実装方法を詳しく解説

jsでボタンに背景画像を追加する一般的な方法まとめ

以上がjsでランダムに切り替わる背景画像を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。