我正在创建一个单页网站,我希望每次加载页面时都添加一个随机图像。在我使用PHP随机化我的轮播之前,使用 ORDER BY rand()
,而选择数据。现在我正在寻找一个随机图像的JavaScript代码不使用任何数据库。我接受任何建议,我的代码如下:
<!-- start home -->
<section id="home">
<div class="container">
<div class="row">
<div class="col-md-offset-2 col-md-8">
<h1 class="wow fadeIn" data-wow-offset="50" data-wow-delay="0.9s">We make paper products that are <span>awesome</span></h1>
<div class="element">
<div class="sub-element">Hello, this is WhatWeAre</div>
<div class="sub-element">Paper for everyone</div>
<div class="sub-element">Contact us and we make your products while conserving environment </div>
</div>
<a data-scroll href="#about" class="btn btn-default wow fadeInUp" data-wow-offset="50" data-wow-delay="0.6s">GET STARTED</a>
</div>
</div>
</div>
</section>
<!-- end home -->
<style type="text/css">
#home{
background: url('../images/home_1.jpg') no-repeat;
background-size: cover;
padding-top: 160px;
padding-bottom: 100px;
min-height: 650px;
}
</style>
答案 0 :(得分:0)
好的,我得到了一些网站的答案。我的CSS样式表没有做任何更改,甚至没有使用数据库。这里有以下代码:
<script type="text/javascript">
if (document.getElementById) {
window.onload = swap
};
function swap() {
var numimages=7;
rndimg = new Array("images/home.jpeg","images/home-bg.jpg","images/home_1.jpg");
x=(Math.floor(Math.random()*numimages));
randomimage=(rndimg[x]);
document.getElementById("home").style.backgroundImage = "url("+ randomimage +")";
}
</script>