Change DIV background image randomly at regular interval in JavaScript

Last Reply 10 months ago By dharmendr

Posted 10 months ago

I have designed the site:

alpha.dubaiexporters.com

What i wanted to do is that there is a background image behind the search panel.

i wanted to change it randomly. so if i have 4 images, it should change after 10 seconds randomly.

How to achieve it?

<div id="main_header_bg">
    <style type="text/css" media="all">
        #main_header_image { background: url('https://d12dkjq56sjcos.cloudfront.net/pub/media/wysiwyg/Dubai-Skyline-Burj-Al-Arab-Big-Bus-Tours-01.17.jpg'); height: 747px; background-size: cover !important; background-position: 100% !important; }
        #main_header_image1 { background: url('xyz.jpg'); height: 747px; background-size: cover !important; background-position: 100% !important; }
        #main_header_image2 { background: url('abc.jpg'); height: 747px; background-size: cover !important; background-position: 100% !important; }
    </style>
</div>
 
<div id="main_header_image">
</div>
 
<div id="main_header_image1">
</div>
 
<div id="main_header_image2">
</div>

 

This question does not have replies that have been liked.