Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
HTML/JavaScript ad rotator for blogs. Drop the + in line 16 to show one ad at a time.
<script type="text/javascript">
var ads = [];
ads[0] = '<a href="FIRST SPONSOR URL HERE" target="_blank" rel="nofollow"><img src="FIRST SPONSOR IMAGE URL HERE" alt="FIRST SPONSOR NAME" title="FIRST SPONSOR NAME" width="125" height="125"></a>'
ads[1] = '<a href="SECOND SPONSOR URL HERE" target="_blank" rel="nofollow"><img src="SECOND SPONSOR IMAGE URL HERE" alt="SECOND SPONSOR NAME" title="SECOND SPONSOR NAME" width="125" height="125"></a>'
ads[2] = '<a href="THIRD SPONSOR URL HERE" target="_blank" rel="nofollow"><img src="THIRD SPONSOR IMAGE URL HERE" alt="THIRD SPONSOR NAME" title="THIRD SPONSOR NAME" width="125" height="125"></a>'
ads[3] = '<a href="FOURTH SPONSOR URL HERE" target="_blank" rel="nofollow"><img src="FOURTH SPONSOR IMAGE URL HERE" alt="FOURTH SPONSOR NAME" title="FOURTH SPONSOR NAME" width="125" height="125"></a>'
ads[4] = '<a href="FIFTH SPONSOR URL HERE" target="_blank" rel="nofollow"><img src="FIFTH SPONSOR IMAGE URL HERE" alt="FIFTH SPONSOR NAME" title="FIFTH SPONSOR NAME" width="125" height="125"></a>'
ads[5] = '<a href="SIXTH SPONSOR URL HERE" target="_blank" rel="nofollow"><img src="SIXTH SPONSOR IMAGE URL HERE" alt="SIXTH SPONSOR NAME" title="SIXTH SPONSOR NAME" width="125" height="125"></a>'
var x = 0;
function rotate(ads) {
while (x < ads.length) {
var sort = Math.floor(Math.random() * ads.length);
if (ads[sort] != 0) {
document.getElementById('adspace').innerHTML += (ads[sort]);
ads[sort] = 0;
x++;
}
}
}
</script>
<style>
#adspace {
width: 315px;
margin: 0 auto;
}
#adspace img {
float: left;
margin-right: 5px;
margin-bottom: 5px;
}
</style>
<div id="adspace">
<script type="text/javascript">
rotate(ads);
</script>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.