Look this link. It is very simple and I don't think you need comments. Another question is how to set up time to each image.
Time to use some jQuery:
Your html code:
<div class='ads'></div>
<div class='ads'></div>
And the css code:
.ads {
position: relative;
top: 15px;
float: right;
height: 60px;
width: 468px;
}
Your jQuery code:
$(".ads").each(function() {
var timestamp = $.now();
$(this).css("background-image", "url('/images/ads/ads_top.gif?"+timestamp+"')");
});
Your jQuery code have to be placed into the .js
file. Do you have some js
files? If yes, then add my code into onload
handler. If you don't have any create new file, say, scripts.js
and put this code into it:
$(document).ready(function()
{
$(".ads").each(function() {
var timestamp = $.now();
$(this).css("background-image", "url('/images/ads/ads_top.gif?"+timestamp+"')");
});
}
Explanation:
.ready
function means that all instructions in body of this function will be read and started on page load. You don't need them to work before page loaded, right?$(".ads")
— we get element with selector.ads
(with classads
).$(".ads").each(function() { /* body */ }
—.each
function means that we will assign instructions from function body to all elements with selector.ads
var timestamp = $.now();
— getting timestamp and assigning it into variable$(this).css("background-image", "url('/images/ads/ads_top.gif?"+timestamp+"')");
— adding css property to$(this)
element (this
element is current element with selector.ads
)
Thats all. Simple. Now you have file scripts.js
with content above. Put it somewhere on your site, where you usually put your media files. For example, {root}/media/
<-- here.
The last thing you should do is link your new js file and jQuery library. Note, that jQuery library have to be linked before file, using $
variable.
Add next code to the <head></head>
tag to your view:
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="/media/script.js"></script>
Don't forget to do all js actions in onload
handler.
Hope this will help. Tell me about result, please.