Npcink Blog
切换菜单

JS 刷新页面实现随机背景图功能 - JS 笔记

每一次页面的刷新，都会让他好奇下一张是什么。这一次的 JS 笔记分享这样的随机背景图功能

最后更新于
本页目录1 节

每次刷新都会带来不同的背景图，给你的访客带来不一样的心情。每一次页面的刷新，都会让他好奇下一张是什么。这一次的 JS 笔记分享这样的随机背景图功能。

核心代码

    <script>
        var bodyBgs = [];
        bodyBgs[0] = "./images/1.jpg";
        bodyBgs[1] = "./images/2.jpg";
        bodyBgs[2] = "./images/3.jpg";
        bodyBgs[3] = "./images/4.jpg";
        var randomBgIndex = Math.round(Math.random() * 3);
        //输出随机的背景图
        document.write('<style>body{background:url(' + bodyBgs[randomBgIndex] + ')top center no-repeat; background-size:cover;}</style>');


    </script>