Blogger hack:Create Bubble effect on your blog

Hello there! If you are new here, you might want to subscribe to the RSS feed for updates on this topic.

Give you page a bubbly personality with this script! Bubbles drift upwards, then vanish, in an incessant loop .Isn’t it Interesting? You can simply create this hack on your blog by pasting the following Code in your Template.

<script language="JavaScript1.2"><!-- Begin

//Bubble Script by Lisa (issa@lissaexplains.com, http://lissaexplains.com)//Based on code by Altan d.o.o. (snow@altan.hr)//For full source code and installation instructions to this script, visit http://www.dynamicdrive.com

var no = 15; // image number or falling ratevar speed = 2; // the lower the number the faster the image movesvar snow = new Array();snow[0] = "http://www.dynamicdrive.com/dynamicindex3/bubble.gif"snow[1] = "http://www.dynamicdrive.com/dynamicindex3/bubble.gif"snow[2] = "http://www.dynamicdrive.com/dynamicindex3/bubble.gif"

var ns4up = (document.layers) ? 1 : 0; // browser sniffervar ie4up = (document.all) ? 1 : 0;var ns6up = (document.getElementById&&!document.all) ? 1 : 0;var dx, xp, yp; // coordinate and position variablesvar am, stx, sty; // amplitude and step variablesvar i, doc_width = 800, doc_height = 1800;

if (ns4up||ns6up) {doc_width = self.innerWidth;doc_height = self.innerHeight;} else if (ie4up) {doc_width = document.body.clientWidth;doc_height = document.body.clientHeight;}

dx = new Array();xp = new Array();yp = new Array();am = new Array();stx = new Array();sty = new Array();j = 0;

for (i = 0; i < no; ++ i) {dx[i] = 0; // set coordinate variablesxp[i] = Math.random()*(doc_width-50); // set position variablesyp[i] = Math.random()*doc_height;am[i] = Math.random()*20; // set amplitude variablesstx[i] = 0.02 + Math.random()/10; // set step variablessty[i] = 0.7 + Math.random(); // set step variablesif (ns4up) { // set layersif (i == 0) {document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><img src=\""+ snow[j] + "\" border=\"0\"></layer>");} else {document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><img src=\""+ snow[j] + "\" border=\"0\"></layer>");} } else if (ie4up||ns6up) { if (i == 0) {document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"VISIBILITY: visible; TOP: 15px; LEFT: 15px; width:1;\"><img src=\"" + snow[j] + "\" border=\"0\"></div>");} else {document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"VISIBILITY: visible; TOP: 15px; LEFT: 15px; width:1;\"><img src=\"" + snow[j] + "\" border=\"0\"></div>");}}if (j == (snow.length-1)) { j = 0; } else { j += 1; }}

function snowNS() { // Netscape main animation functionfor (i = 0; i < no; ++ i) { // iterate for every dotyp[i] -= sty[i]; if (yp[i] < -50) {xp[i] = Math.random()*(doc_width-am[i]-30);yp[i] = doc_height;stx[i] = 0.02 + Math.random()/10;sty[i] = 0.7 + Math.random();doc_width = self.innerWidth;doc_height = self.innerHeight; }dx[i] += stx[i];document.layers["dot"+i].top = yp[i]+pageYOffset;document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);}setTimeout("snowNS()", speed);}

function snowIE_NS6() { // IE main animation functionfor (i = 0; i < no; ++ i) { // iterate for every dotyp[i] -= sty[i];if (yp[i] < -50) {xp[i] = Math.random()*(doc_width-am[i]-30);yp[i] = doc_height;stx[i] = 0.02 + Math.random()/10;sty[i] = 0.7 + Math.random();doc_width = ns6up?window.innerWidth-5:document.body.clientWidth;doc_height = ns6up?window.innerHeight-5:document.body.clientHeight;}dx[i] += stx[i];if (ie4up){document.all["dot"+i].style.pixelTop = yp[i]+document.body.scrollTop;document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);}else if (ns6up){document.getElementById("dot"+i).style.top=yp[i]+pageYOffset;document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i]);}}setTimeout("snowIE_NS6()", speed);}

if (ns4up) {snowNS();} else if (ie4up||ns6up) {snowIE_NS6();}// End --></script>