auto-cycling backgrounds

If you want to have multiple backgrounds on your blog that randomly appear on every refresh, then you should add the following javascript code in this way:

Go into design, then into page elements, choose add a gadget, from the pop-up menu select HTML/JavaScript, there is no need for a title, into the content area copy/paste the following code:

<script type="text/javascript">
var banner= new Array()
banner[0]="image1.url"
banner[1]="image2.url"
banner[2]="image3.url"
var random=Math.floor(3*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background:url("' + banner[random] + '") no-repeat top left;');
document.write(" }");
document.write("</style>");
</script>

Additional important notes:
  • image1.url, image2.url etc. shouldbe changed with the actual url of your image.
  • if you have more or less images you can adjust the number accordingly, keeping the same style in mind either by deleting extras or creating "banner[3], banner[4]" etc. You also have to adjust the number in red and make it equal to the number of images that you are using.
  • if you are using small images which should repeat themselves such as textures for backgrounds, then you should replace "no-repeat top left" with "repeat center center"
.................................................................................................................................
Powered by Blogger.