! =]¦Y¦[åx¡Mµ§= !

::Efeitos de Mouse::

Instruções: Para copiar os códigos selecione o código e aperte Ctrl+C

Depois para colar aperte Ctrl+V (Colem no seu template)

Informações: Imagens e Scripts retirados dos sites Tutorial de Email e Dynamite





Mouse com mensagem rodando em volta

Onde está escrito "QUALQUER COISA AQUI" Substitua pela sua mensagem.
Cole entre as tags <head> e </head>.
<SCRIPT LANGUAGE="JavaScript"> if (document.all) { yourLogo = "* QUALQUER COISA AQUI "; logoFont = " verdana"; logoColor = " #FFFFFF"; yourLogo = yourLogo.split(''); L = yourLogo.length; TrigSplit = 360 / L; Sz = new Array() logoWidth = 70; logoHeight = -30; ypos = 0; xpos = 0; step = 0.04; currStep = 0; document.write('<div id="outer" style="position:absolute;top:0px;left:0px "><div style="position:relative">'); for (i = 0; i < L; i++) { document.write('<div id="ie" style="position:absolute;top:0px;left:0px ;' +'width:10px;height:10px;font-family: '+logoFont+'; font-size:12px;' +'color:'+logoColor+'; text-align:cent er">'+yourLogo[i]+'</div>'); } document.write('</div></div>'); function Mouse() { ypos = event.y; xpos = event.x - 3; } document.onmousemove=Mouse; function animateLogo() { outer.style.pixelTop = document.body.scrollTop; for (i = 0; i < L; i++) { ie[i].style.top = ypos + logoHeight * Math.sin(currStep + i * TrigSplit * Math.PI / 180); ie[i].style.left = xpos + logoWidth * Math.cos(currStep + i * TrigSplit * Math.PI / 180); Sz[i] = ie[i].style.pixelTop - ypos; if (Sz[i] < 5) Sz[i] = 3; ie[i].style.fontSize = Sz[i] / 1.7; } currStep -= step; setTimeout('animateLogo()', 10); } window.onload = animateLogo; } // End --> </SCRIPT>

#FFFFFF é a cor que vai ser a mensagem, você pode mudar para a cor que quiser

(veja tabela dos códigos das cores)

Mouse com coraçãozinho rodando em volta
Cole depois da tag <body> de seu template. Troque a cor #0000FF (azul) epla que deseja, atraves da tabela de cores
<SCRIPT LANGUAGE="JavaScript1.2"> </SCRIPT>

Mouse com palavras que acompanham o mouse

São dois scripts: O primeiro, você põe dentro das tags </head> e </head>
<style>--> .animado {position:absolute;visibility:visible;top:-50px; font-size:10pt;font-family:Arial;font-weight:bold; color:#000000;} </style>
O outro é abaixo da tag <body>
Onde está escrito "Teste" Substitua pela sua mensagem.
<script language=JavaScript> var x,y var tempo=10 var espera=0 var texto="TESTE " texto=texto.split("") var xpos=new Array() for (i=0;i<=texto.length-1;i++) { xpos[i]=-50 } var ypos=new Array() for (i=0;i<=texto.length-1;i++) { ypos[i]=-50 } function seguir(e){ x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY espera=1 } function animar_cursor() { if (espera==1 && document.all) { for (i=texto.length-1; i>=1; i--) { xpos[i]=xpos[i-1]+tempo ypos[i]=ypos[i-1] } xpos[0]=x+tempo ypos[0]=y for (i=0; i<texto.length-1; i++) { var camada = eval("span"+(i)+".style") camada.posLeft=xpos[i] camada.posTop=ypos[i] } } else if (espera==1 && document.layers) { for (i=texto.length-1; i>=1; i--) { xpos[i]=xpos[i-1]+tempo ypos[i]=ypos[i-1] } xpos[0]=x+tempo ypos[0]=y for (i=0; i<texto.length-1; i++) { var camada = eval("document.span"+i) camada.left=xpos[i] camada.top=ypos[i] } } var timer=setTimeout("animar_cursor()",30) } </script> <script Language=JavaScript> for (i=0;i<=texto.length-1;i++) { document.write("<span id='span"+i+"' class='animado'>") document.write(texto[i]) document.write("</span>") } if (document.layers){ document.captureEvents(Event.MOUSEMOVE); } document.onmousemove = seguir; animar_cursor() </script>

Mouse Cometa

Pontinhos coloridos seguem o mouse. Colocar depois de <body>

 <LAYER name="a0" left=10 top=10 clip="0,0,1,1"></LAYER> <LAYER name="a1" left=10 top=10 clip="0,0,1,1"></LAYER> <LAYER name="a2" left=10 top=10 clip="0,0,1,1"></LAYER> <LAYER name="a3" left=10 top=10 clip="0,0,1,1"></LAYER> <LAYER name="a4" left=10 top=10 clip="0,0,1,1"></LAYER> <LAYER name="a5" left=10 top=10 clip="0,0,1,1"></LAYER> <LAYER name="a6" left=10 top=10 clip="0,0,1,1"></LAYER> <LAYER name="a7" left=10 top=10 clip="0,0,2,2"></LAYER> <LAYER name="a8" left=10 top=10 clip="0,0,2,2"></LAYER> <LAYER name="a9" left=10 top=10 clip="0,0,2,2"></LAYER> <LAYER name="a10" left=10 top=10 clip="0,0,2,2"></LAYER> <LAYER name="a11" left=10 top=10 clip="0,0,2,2"></LAYER> <LAYER name="a12" left=10 top=10 clip="0,0,2,2"></LAYER> <LAYER name="a13" left=10 top=10 clip="0,0,3,3"></LAYER> <DIV id="starsDiv" style="position:absolute;top:0px;left:0px"> <DIV style="position:relative;width:1px;height:1px;font-size:1px"></DIV> <DIV style="position:relative;width:1px;height:1px;font-size:1px"></DIV> <DIV style="position:relative;width:1px;height:1px;font-size:1px"></DIV> <DIV style="position:relative;width:1px;height:1px;font-size:1px"></DIV> <DIV style="position:relative;width:1px;height:1px;font-size:1px"></DIV> <DIV style="position:relative;width:1px;height:1px;font-size:1px"></DIV> <DIV style="position:relative;width:1px;height:1px;font-size:1px"></DIV> <DIV style="position:relative;width:2px;height:2px;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;font-size:2px"></DIV> <DIV style="position:relative;width:3px;height:3px;font-size:3px"></DIV> </DIV> <SCRIPT language="JavaScript"> /* Mouse Comet Copyright Kurt Grigg (website.lineone.net/~kurt.grigg/javascript) To add more shock to your site, visit www.DHTML Shock.com */ var Clrs=new Array(6) Clrs[0]='ff0000'; Clrs[1]='00ff00'; Clrs[2]='000aff'; Clrs[3]='ff00ff'; Clrs[4]='fff000'; Clrs[5]='fffff0'; var yBase = 200; var xBase = 200; var step; var currStep = 0; var Xpos = 1; var Ypos = 1; var Xs = 200; var Ys = 400; if (document.layers) { window.captureEvents(Event.MOUSEMOVE); } if (document.all) { function MoveHandler(){ Xpos = document.body.scrollLeft+event.x; Ypos = document.body.scrollTop+event.y; } document.onmousemove = MoveHandler; } else if (document.layers) { function xMoveHandler(evnt){ Xpos = evnt.pageX; Ypos = evnt.pageY; } window.onMouseMove = xMoveHandler; } function Comet() { if (document.all) { yBase = window.document.body.offsetHeight/4; xBase = window.document.body.offsetWidth/4; } else if (document.layers) { yBase = window.innerHeight/4; xBase = window.innerWidth/4; } if (document.all) { for ( i = 0 ; i < starsDiv.all.length ; i++ ) {step=3; starsDiv.all[i].style.top = Ypos + yBase*Math.cos((currStep + i*4)/12)*Math.cos(0.7+currStep/200); starsDiv.all[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(8.2+currStep/400); for (ai=0; ai < Clrs.length; ai++) { var c=Math.round(Math.random()*[ai]); } starsDiv.all[i].style.background=Clrs[c]; } } else if (document.layers) { for ( j = 0 ; j < 14 ; j++ ) //number of NS layers! {step = 6; var templayer="a"+j document.layers[templayer].top = Ypos + yBase*Math.cos((currStep + j*4)/12)*Math.cos(0.7+currStep/200); document.layers[templayer].left = Xpos + xBase*Math.sin((currStep + j*3)/10)*Math.sin(8.2+currStep/400); for (aj=0; aj < Clrs.length; aj++) { var c=Math.round(Math.random()*[aj]); } document.layers[templayer].bgColor=Clrs[c]; } } currStep+= step; setTimeout("Comet()", 5); } Comet(); // --> </SCRIPT> 

Mouse Spin

Pontinhos coloridos seguem o mouse numa linda animação. Colocar depois de <body>

<SCRIPT language="JavaScript"> /* Morph Spin Copyright Kurt Grigg (website.lineone.net/~kurt.grigg/javascript) To add more shock to your site, visit www.DHTML Shock.com */ var Clrs=new Array(7) Clrs[0]='ffffff'; Clrs[1]='00ff00'; Clrs[2]='000aff'; Clrs[3]='ff00ff'; Clrs[4]='fff000'; Clrs[5]='ffffff'; Clrs[6]='ff0000'; var speed=1; var RunTime = 0; var cntr=0; var xcntr=100; var Nslayers; var pulse=25; var onClrs; var Xpos = 421; var Ypos = 231; var _y; if (document.layers){ window.captureEvents(Event.MOUSEMOVE); function xFollowMouse(evnt){ Xpos = evnt.pageX; Ypos = evnt.pageY; } window.onMouseMove = xFollowMouse; document.write('<layer name="a0" left=10 top=10 bgcolor="#ff0000" clip="0,0,2,2"></layer>' +'<layer name="a1" left=10 top=10 bgcolor="#00ff00" clip="0,0,2,2"></layer>' +'<layer name="a2" left=10 top=10 bgcolor="#ffffff" clip="0,0,2,2"></layer>' +'<layer name="a3" left=10 top=10 bgcolor="#ffa500" clip="0,0,2,2"></layer>' +'<layer name="a4" left=10 top=10 bgcolor="#ff00ff" clip="0,0,2,2"></layer>' +'<layer name="a5" left=10 top=10 bgcolor="#8888ff" clip="0,0,2,2"></layer>' +'<layer name="a6" left=10 top=10 bgcolor="#fff000" clip="0,0,2,2"></layer>'); } else if (document.all){ function FollowMouse(){ Xpos = document.body.scrollLeft+event.x; Ypos = document.body.scrollTop+event.y; } document.onmousemove = FollowMouse; document.write('<div id="ieDiv" style="position:absolute;top:0px;left:0px">' +'<div id="c" style="position:relative">' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ff0000;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#00ff00;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ffffff;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ffa500;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ff00ff;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#8888ff;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#fff000;font-size:2px"></div>' +'</div>' +'</div>'); } function sv2(){ if (document.layers){ for (i=0;i<7;i++) { Nslayers="a"+i; document.layers[0].top=Ypos+cntr*Math.cos((RunTime+i*4.5)/5); document.layers[0].left=Xpos+cntr*Math.sin((RunTime+i*4.5)/5); for (n=0; n < Clrs.length; n++) { var x=Math.round(Math.random()*[n]); } document.layers[0].bgColor=Clrs[x]; } cntr+=1; RunTime+=speed; stp=setTimeout('sv2()',10); if (cntr>=100) { cntr=100; speed=2.5; for (i=0;i<7;i++) { Nslayers="a"+i; document.layers[Nslayers].top=Ypos+cntr*Math.cos((RunTime-100)*i/90); document.layers[Nslayers].left=Xpos+cntr*Math.sin((RunTime-100)*i/90); } } if (RunTime>182) { speed=0.5; for (i=0;i<7;i++) { Nslayers="a"+i; document.layers[Nslayers].top=Ypos+xcntr*Math.cos(((RunTime-182)+i*4.5)/5)*Math.cos((RunTime-182)/5); document.layers[Nslayers].left=Xpos+xcntr*Math.sin(((RunTime-182)+i*4.5)/5); } } } else if (document.all){ for (i=0;i<ieDiv.all.c.all.length;i++) { ieDiv.all.c.all[0].style.top=Ypos+cntr*Math.cos((RunTime+i*4.5)/5); ieDiv.all.c.all[0].style.left=Xpos+cntr*Math.sin((RunTime+i*4.5)/5); for (n=0; n < Clrs.length; n++) { var x=Math.round(Math.random()*[n]); } ieDiv.all.c.all[0].style.background=Clrs[x]; } cntr+=1; RunTime+=speed; window.status=RunTime; stp=setTimeout('sv2()',10); if (cntr>=100) { cntr=100; speed=2.5; for (i=0;i<ieDiv.all.c.all.length;i++) { ieDiv.all.c.all[i].style.top=Ypos+cntr*Math.cos((RunTime-100)*i/90); ieDiv.all.c.all[i].style.left=Xpos+cntr*Math.sin((RunTime-100)*i/90); } } if (RunTime>182) { speed=0.5; for (i=0;i<ieDiv.all.c.all.length;i++) { ieDiv.all.c.all[i].style.top=Ypos+xcntr*Math.cos(((RunTime-182)+i*4.5)/5)*Math.cos((RunTime-182)/5); ieDiv.all.c.all[i].style.left=Xpos+xcntr*Math.sin(((RunTime-182)+i*4.5)/5); } } } if (RunTime>210) { xcntr-=10; } if (document.layers) _y=-window.innerWidth-90; else if (document.all) _y=-document.body.clientWidth-90; if (xcntr <= _y) { RunTime=0; speed=1; cntr=0; xcntr=100; } } sv2() //--> </SCRIPT>

Mouse estrelar

Estrelas como uma nebulosa segue o mouse. Colocar depois de <body>

 <LAYER name="a0" left=10 top=10 bgcolor="#FF0000" clip="0,0,2,2"></LAYER> <LAYER name="a1" left=10 top=10 bgcolor="#FF8000" clip="0,0,2,2"></LAYER> <LAYER name="a2" left=10 top=10 bgcolor="#FFFF00" clip="0,0,2,2"></LAYER> <LAYER name="a3" left=10 top=10 bgcolor="#00FF00" clip="0,0,2,2"></LAYER> <LAYER name="a4" left=10 top=10 bgcolor="#0000FF" clip="0,0,2,2"></LAYER> <LAYER name="a5" left=10 top=10 bgcolor="#FF00FF" clip="0,0,2,2"></LAYER> <LAYER name="a6" left=10 top=10 bgcolor="#FFFFFF" clip="0,0,2,2"></LAYER> <DIV id="starsDiv" style="position:absolute;top:0px;left:0px"> <DIV style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;background:#ffff00;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;background:#ffa000;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;background:#ff0000;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;background:#00ff00;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;background:#0000ff;font-size:2px"></DIV> <DIV style="position:relative;width:2px;height:2px;background:#FF00FF;font-size:2px"></DIV> </DIV> <SCRIPT language="JavaScript"> /* Mouse Stars Copyright Kurt Grigg (website.lineone.net/~kurt.grigg/javascript) To add more shock to your site, visit www.DHTML Shock.com */ if (document.layers) {window.captureEvents(Event.MOUSEMOVE);} var yBase = 200; var xBase = 200; var step = .2; var currStep = 0; var Xpos = 1; var Ypos = 1; var i = 0; var j = 0; if (document.all) { function MoveHandler(){ Xpos = document.body.scrollLeft+event.x; Ypos = document.body.scrollTop+event.y; } document.onmousemove = MoveHandler; } else if (document.layers) { function xMoveHandler(evnt){ Xpos = evnt.pageX; Ypos = evnt.pageY; } window.onMouseMove = xMoveHandler; } function animateLogo(){ if (document.all) { yBase = window.document.body.offsetHeight/4; xBase = window.document.body.offsetWidth/4; } else if (document.layers) { yBase = window.innerHeight/4; xBase = window.innerWidth/4; } if (document.all) { for ( i = 0 ; i < starsDiv.all.length ; i++ ) { starsDiv.all[i].style.top = Ypos + Math.cos((20*Math.sin(currStep/20))+i*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + i*25)/10); starsDiv.all[i].style.left = Xpos + Math.sin((20*Math.sin(currStep/20))+i*70)*xBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + i*25)/10); } } else if (document.layers) { for ( j = 0 ; j < 7 ; j++ ) //7 is number of NS layers! { var templayer="a"+j document.layers[templayer].top = Ypos + Math.cos((20*Math.sin(currStep/20))+j*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + j*25)/10); document.layers[templayer].left =Xpos + Math.sin((20*Math.sin(currStep/20))+j*70)*xBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep + j*25)/10); } } currStep += step; setTimeout("animateLogo()", 10); } animateLogo(); // --> </SCRIPT> 

Mouse com Estrelas Pulsantes

Pontinhos coloridos que pulsam. Colocar depois de <body>

<script language="javascript"> /* Pulse Spin Copyright Kurt Grigg (website.lineone.net/~kurt.grigg/javascript) To add more shock to your site, visit www.DHTML Shock.com */ var speed; var RunTime = 0; var Xpos = 0; var Ypos = 0; var pulse=25; var cnter=70; var _y; if (document.layers) { document.write('<LAYER NAME="a0" LEFT=10 TOP=10 BGCOLOR="#FF0000" CLIP="0,0,2,2"></LAYER>' +'<LAYER NAME="a1" LEFT=10 TOP=10 BGCOLOR="#FF8000" CLIP="0,0,2,2"></LAYER>' +'<LAYER NAME="a2" LEFT=10 TOP=10 BGCOLOR="#FFFF00" CLIP="0,0,2,2"></LAYER>' +'<LAYER NAME="a3" LEFT=10 TOP=10 BGCOLOR="#00FF00" CLIP="0,0,2,2"></LAYER>' +'<LAYER NAME="a4" LEFT=10 TOP=10 BGCOLOR="#0000FF" CLIP="0,0,2,2"></LAYER>' +'<LAYER NAME="a5" LEFT=10 TOP=10 BGCOLOR="#FF00FF" CLIP="0,0,2,2"></LAYER>' +'<LAYER NAME="a6" LEFT=10 TOP=10 BGCOLOR="#FFFFFF" CLIP="0,0,2,2"></LAYER>'); window.captureEvents(Event.MOUSEMOVE); function xMoveHandler(evnt){ Xpos = evnt.pageX; Ypos = evnt.pageY; } window.onMouseMove = xMoveHandler; } else if (document.all) { document.write('<div id="ieDiv" style="position:absolute;top:0px;left:0px">' +'<div id="c" style="position:relative">' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ff0000;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#00ff00;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ffffff;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ffa500;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#ff00ff;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#8888ff;font-size:2px"></div>' +'<div style="position:absolute;top:0px;left:0px;width:2px;height:2px;background:#fff000;font-size:2px"></div>' +'</div>' +'</div>'); function MoveHandler(){ Xpos = document.body.scrollLeft+event.x; Ypos = document.body.scrollTop+event.y; } document.onmousemove = MoveHandler; } function sv3(){ if (RunTime<0.0550) speed=0.001; if (document.layers) { for (i=0;i<7;i++) { var ntscp="a"+i document.layers[ntscp].top=Ypos+cnter*Math.cos((RunTime+i*4.5)/5)*Math.sin((RunTime)*150); document.layers[ntscp].left=Xpos+cnter*Math.sin((RunTime+i*4.5)/5)*Math.sin((RunTime)*150); } } else if (document.all) { for (i=0;i<ieDiv.all.c.all.length;i++) { ieDiv.all.c.all[i].style.top=Ypos+cnter*Math.cos((RunTime+i*4.5)/5)*Math.sin((RunTime)*150); ieDiv.all.c.all[i].style.left=Xpos+cnter*Math.sin((RunTime+i*4.5)/5)*Math.sin((RunTime)*150); } } RunTime+=speed; stp=setTimeout('sv3()',10); if (RunTime>0.0540) { speed+=0.002; if (document.layers) { for (i=0;i<7;i++) { var ntscp="a"+i document.layers[ntscp].top=Ypos+cnter*Math.cos((RunTime+i*4.5)/5) document.layers[ntscp].left=Xpos+cnter*Math.sin((RunTime+i*4.5)/5) } } else if (document.all) { for (i=0;i<ieDiv.all.c.all.length;i++) { ieDiv.all.c.all[i].style.top=Ypos+cnter*Math.cos((RunTime+i*4.5)/5) ieDiv.all.c.all[i].style.left=Xpos+cnter*Math.sin((RunTime+i*4.5)/5) } } } if (speed > 0.5) { speed=0.5; cnter-=8; } if (document.layers) _y=-window.innerHeight; else if (document.all) _y=-document.body.clientHeight; if (cnter <= _y) { RunTime=0; speed=0.001; cnter=70; } } sv3(); //--> </SCRIPT>

Créditos à TPB