Javascript：如何在页面加载时随机化图像

-5

我现在正在创建单页网站，并且每次页面加载时我都想添加一个随机图像。在我使用PHP随机化我的传送带之前，使用ORDER BY rand()而选择数据。现在我正在寻找一个JavaScript代码来随机化图像不使用任何数据库。我接受任何建议，我的代码如下：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>

来源

2017-04-04 Ace

好的，我们有他同样的问题先生。这个问题不仅对我而且对每个人都很有用。我希望这将有所帮助。 – 2017-04-10 02:55:40

好的，我得到了一些网站的答案。不对我的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>

来源

2017-04-04 02:40:21 Ace

除非您尝试支持IE4，否则您不需要'if（document.getElementById）'测试。你应该用'var'声明所有的变量。另外，使用'rndimg.length'而不是'numimages'，可以自动调整数组的大小...... – nnnnnn

所以你不想**生成**这些图像...你已经去了* database *：'Array（“images/home.jpeg”，“images/home-bg.jpg”，“images/home_1.jpg”）即使它在您的html文件中被硬编码。 – Kaiido

是的，我只是有一个预定义的图像，并获得它使用数组。我把它放在我的自定义脚本上。 – Ace

Javascript：如何在页面加载时随机化图像

回答

相关问题