刷新页面时随机背景？答案

【问题标题】：Random background when you refresh the page?刷新页面时随机背景？
【发布时间】：2015-11-27 02:17:44
【问题描述】：

我有 14 张图片，我希望页面在加载/刷新页面时随机选择其中一张。

在我决定要使用这些图像之前，我有一个带有以下 CSS 代码的背景，它运行良好，我也想将它用于这些新图像：

 #bg {position:fixed; top: 0px; width:100%; height:100%; background: url('http://i.imgur.com/B8ubW70.jpg') center center no-repeat; background-size: cover; }

<div id="bg"></div>

【问题讨论】：

你需要告诉我们你已经尝试过哪些东西（javascript）
我什么都没试过，因为我不知道从哪里开始 lmao

标签： javascript jquery css background background-image

【解决方案1】：

您可以使用 Math.random() 来获取随机图片索引。

在你的情况下，如果你有 14 张照片，请使用：

var picno = (Math.random() * 100) % 14

这将返回一个介于 0 和 13 之间的数字。之后，您可以使用 element.style.backgroundImage() 在 onload 事件上更改它

window.onload = 初始化

function init() {
    element.style.backgroundImage = url(pic_path_array[picno]);
}

【讨论】：

【解决方案2】：

我的解决方案使用 JavaScript。

你创建的第一个带有图片的 bgimg 文件夹：

> index.html 
> bgimg (folder)
> -- 1.jpg
> -- 2.jpg
> -- 3.jpg
> -- ......

并在下面使用 JavaScript：

<html>
<head>
<script type="text/javascript">
var totalCount = 8;
function ChangeIt()
{
var num = Math.ceil( Math.random() * totalCount );
document.body.background = 'bgimg/'+num+'.jpg';
document.body.style.backgroundRepeat = "repeat";// Background repeat
}
</script>
</head>
<body>
// Page Design
</body>
<script type="text/javascript">
ChangeIt();
</script>
</html>

【讨论】：