Bolas seguindo o cursor do mouse.
Autor: Lucas Lima | Publicado: 2012-01-24T05:25:00-08:00

Olá gente estarei colocando um código de bolas seguindo o cursor do mouse no blog é muito fácil de colocar e ainda os seus visitantes poderão interagir com isso eu testei e achei bem interessante entre em seu blog vá em desing adicionar um gadget HTML/java script e cole esse código lá&lt;!--Simply copy and paste into the &lt;body&gt;&lt;/body&gt; of your page.--&gt;&lt;div id="dot0" style="position: absolute; visibility: hidden; height: 11; width: 11;"&gt;&lt;/div&gt;&lt;div id="dot1" style="position: absolute; height: 35; width: 35;"&gt;&lt;img src="ball1.gif" width="11" height="11" alt=""&gt;&lt;/div&gt;&lt;div id="dot2" style="position: absolute; height: 35; width: 35;"&gt;&lt;img src="ball1.gif" width="11" height="11" alt="."&gt;&lt;/div&gt;&lt;div id="dot3" style="position: absolute; height: 35; width: 35;"&gt;&lt;img src="ball1.gif" width="11" height="11" alt="."&gt;&lt;/div&gt;&lt;div id="dot4" style="position: absolute; height: 35; width: 35;"&gt;&lt;img src="ball1.gif"&nbsp;width="11" height="11" alt="."&gt;&lt;/div&gt;&lt;div id="dot5" style="position: absolute; height: 35; width: 35;"&gt;&lt;img src="ball1.gif" width="11" height="11" alt="."&gt;&lt;/div&gt;&lt;div id="dot6" style="position: absolute; height: 35; width: 35;"&gt;&lt;img src="ball1.gif" width="11" height="11" alt="."&gt;&lt;/div&gt;&lt;script type='text/javascript'&gt;&lt;!-- This script and many more from --&gt;&lt;!-- http://rainbow.arch.scriptmania.com --&gt;&lt;!-- Beginvar nDots = 7;if (document.all&amp;&amp;window.print)document.body.style.cssText="overflow-x:hidden;overflow-y:scroll"var Xpos = 0;var Ypos = 0;var DELTAT = .01;var SEGLEN = 10;var SPRINGK = 10;var MASS = 1;var GRAVITY = 50;var RESISTANCE = 10;var STOPVEL = 0.1;var STOPACC = 0.1;var DOTSIZE = 35;var BOUNCE = 0.75;var isNetscape = navigator.appName=="Netscape";var followmouse = true;var dots = new Array();init();function init(){&nbsp;&nbsp;&nbsp; var i = 0;&nbsp;&nbsp;&nbsp; for (i = 0; i &lt; nDots; i++) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i] = new dot(i);&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; for (i = 0; i &lt; nDots; i++) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].obj.left = dots[i].X + "px";&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].obj.top = dots[i].Y + "px";&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (isNetscape) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; startanimate();&nbsp;&nbsp;&nbsp; } else {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; setTimeout("startanimate()", 20);&nbsp;&nbsp;&nbsp; }}function dot(i)&nbsp;{&nbsp;&nbsp;&nbsp; this.X = Xpos;&nbsp;&nbsp;&nbsp; this.Y = Ypos;&nbsp;&nbsp;&nbsp; this.dx = 0;&nbsp;&nbsp;&nbsp; this.dy = 0;&nbsp;&nbsp;&nbsp; this.obj = eval("document.getElementById('dot" + i + "').style");}document.onmousemove = MoveHandler;function startanimate() {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; setInterval("animate()", 20);}function MoveHandler(e) {&nbsp;&nbsp;&nbsp; if (!e) {&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; Xpos = window.event.x + document.body.scrollLeft;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; Ypos = window.event.y + document.body.scrollTop;&nbsp;&nbsp;&nbsp; } else {&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; Xpos = e.pageX;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; Ypos = e.pageY;&nbsp;&nbsp;&nbsp; }}function vec(X, Y){&nbsp;&nbsp;&nbsp; this.X = X;&nbsp;&nbsp;&nbsp; this.Y = Y;}function springForce(i, j, spring){&nbsp;&nbsp;&nbsp; var dx = (dots[i].X - dots[j].X);&nbsp;&nbsp;&nbsp; var dy = (dots[i].Y - dots[j].Y);&nbsp;&nbsp;&nbsp; var len = Math.sqrt(dx*dx + dy*dy);&nbsp;&nbsp;&nbsp; if (len &gt; SEGLEN) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var springF = SPRINGK * (len - SEGLEN);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; spring.X += (dx / len) * springF;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; spring.Y += (dy / len) * springF;&nbsp;&nbsp;&nbsp; }}function animate() {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var start = 0;&nbsp;&nbsp;&nbsp; if (followmouse) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[0].X = Xpos;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[0].Y = Ypos;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; start = 1;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; for (i = start ; i &lt; nDots; i++ ) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var spring = new vec(0, 0);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (i &gt; 0) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; springForce(i-1, i, spring);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (i &lt; (nDots - 1)) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; springForce(i+1, i, spring);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var resist = new vec(-dots[i].dx * RESISTANCE,&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; -dots[i].dy * RESISTANCE);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var accel = new vec((spring.X + resist.X)/ MASS,&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; (spring.Y + resist.Y)/ MASS + GRAVITY);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].dx += (DELTAT * accel.X);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].dy += (DELTAT * accel.Y);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (Math.abs(dots[i].dx) &lt; STOPVEL &amp;&amp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Math.abs(dots[i].dy) &lt; STOPVEL &amp;&amp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Math.abs(accel.X) &lt; STOPACC &amp;&amp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Math.abs(accel.Y) &lt; STOPACC) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].dx = 0;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].dy = 0;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].X += dots[i].dx;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].Y += dots[i].dy;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var height, width;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (isNetscape) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = window.innerHeight + document.scrollTop;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = window.innerWidth + document.scrollLeft;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } else {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = document.body.clientHeight + document.body.scrollTop;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = document.body.clientWidth + document.body.scrollLeft;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (dots[i].Y &gt;=&nbsp; height - DOTSIZE - 1) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (dots[i].dy &gt; 0) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].dy = BOUNCE * -dots[i].dy;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].Y = height - DOTSIZE - 1;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (dots[i].X &gt;= width - DOTSIZE) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (dots[i].dx &gt; 0) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].dx = BOUNCE * -dots[i].dx;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].X = width - DOTSIZE - 1;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (dots[i].X &lt; 0) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; if (dots[i].dx &lt; 0) {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].dx = BOUNCE * -dots[i].dx;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].X = 0;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].obj.left = dots[i].X + "px";&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dots[i].obj.top =&nbsp; dots[i].Y + "px";&nbsp;&nbsp;&nbsp; }}// End --&gt;&lt;/SCRIPT&gt;&nbsp;
NotasNa parte destacada de&nbsp;vermelho&nbsp;é a imagem da corda elástica que irá seguir o cursor do mouse.Troque substituindo pela URL da imagem que você quiser.&nbsp;