Rei do design-™ ØяiǥiиǺŁ ®: Tutorial - Como Colocar Texto Seguindo o Cursor

Reis do Create - Designer de Qualidade!

Tutorial - Como Colocar Texto Seguindo o Cursor

Autor: ǺиÐ€яรØи_รiŁvǺ

Eae galera faz tempo que não posto um tutorial mas hoje vim com tudo hoje vou Ensinar á como colocar um texto seguindo o curso do mouse. esse gadget permite que você coloque um texto seguindo o curso mouse igual a imagem acima blz. Vamos ao tutorial.

para adicional-lo em seu blog e super simples galera , Primeiro acessar a conta do blogger depois em

layout > adicionar um gadget > html javascript > cole o código a baixo no gadget e faça as modificações pedidas.

mensaje = 'O TEXTO QUE QUISER';

font = 'Verdana,Arial';

size = 2;

color = 'orange';

velocidad = 0.7;

n4 = (document.layers);

ie = (document.all);

n6 = (document.getElementById);

mensaje = mensaje.split('');

n = mensaje.length;

a = size*10;

ymouse = 0;

xmouse = 0;

props = "<font face="+font+" color="+color+" size="+size+">";

if (n4)

{

for ( i = 0; i < n; i++)

document.write('<layer left="0" top="0" width="+a+" name="n4mensaje'+i+'" height="+a+"><center>
'+props+mensaje[i]+'</font></center>
</layer>');

}

else if (ie)

{

document.write('<div id="padre" style="position:absolute;top:0px;left:0px">
<div style="position:relative">
');

for (i=0; i < n; i++)

document.write('<div id="iemensaje" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+mensaje[i]+'</font></div>
');

document.write('</div>
</div>
');

}

else if (n6)

{

document.write('<div id="padre" style="position:absolute;top:0px;left:0px">
<div style="position:relative">
');

for (i = 0; i < n; i++)

document.write('<div id="iemensaje'+i+'" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+mensaje[i]+'</font></div>
');

document.write('</div>
</div>
');

}

if(n4)

window.captureEvents(Event.MOUSEMOVE);

function Mouse(evento)

{

if(ie)

{

xmouse = event.x+20;

ymouse = event.y+20;

}

else if(n4 || n6)

{

xmouse = evento.pageX+20;

ymouse = evento.pageY+20;

}

if(n4)

window.onMouseMove = Mouse

else if(ie || n6)

document.onmousemove = Mouse;

y = new Array();

x = new Array();

Y = new Array();

X = new Array();

Yaux = new Array();

Xaux = new Array();

for (i=0; i < n; i++)

{

y[i] = 0;

x[i] = 0;

Y[i] = 0;

X[i] = 0;

Yaux[i] = 0;

Xaux[i] = 0;

}

function asigna()

{

if (ie)

padre.style.top = document.body.scrollTop;

for (i = 0; i < n; i++)

{

if(n4)

{

document.layers['n4mensaje'+i].top = y[i];

document.layers['n4mensaje'+i].left = x[i]+(i*(a/2));

}

else if(ie)

{

iemensaje[i].style.top = y[i];

iemensaje[i].style.left = x[i]+(i*(a/2));

}

else if(n6)

{

eval("document.getElementById('iemensaje"+i+"').style.top = '"+y[i]+"px'");

eval("document.getElementById('iemensaje"+i+"').style.left = '"+(x[i]+(i*(a/2)))+"px'");

}

function ondula()

{

y[0]=Math.round(Y[0] +=((ymouse)-Y[0])*velocidad);

x[0]=Math.round(X[0] +=((xmouse)-X[0])*velocidad);

for (var i = 1; i < n; i++)

{

Yaux[i] = Math.round(Y[i]);

Xaux[i ]= Math.round(X[i]);

y[i] = Math.round(Y[i]=Yaux[i]+(y[i-1]-Y[i])*velocidad);

x[i] = Math.round(X[i]=Xaux[i]+(x[i-1]-X[i])*velocidad);

}

asigna();

setTimeout('ondula()',50);

}

window.onload = ondula;

</script>

Modificações:
onde tem:
Mensagem: O texto que você quer que apareça.
Font: Tipo de letra.
Size: Tamanho da fonte.
Color: A cor que desejar (black, red, green, etc)
Velocidade: O valor pode ser alterado.

Deixe seu Comentário:
Sem comentários »

Categorias:
Tutoriais

0 comentários:

Postar um comentário

------------------------------------------------------------
Regras Para Fazer Um Comentários
Sem Links
Sem Anuncios
Sem Palavrões
Sem Chingamentos
Respeitar

OBRIGADO
------------------------------------------------------------

Reis do Create

Menu

Menu Renders

P.Entregue

Ŵallpapers

CBOX

[+] Parseros de Link

קarceria #2

Tutorial - Como Colocar Texto Seguindo o Cursor

0 comentários:

Postar um comentário

Cbox

[+] Seguidores

Parceiros

Curta a Rei do Design no Face

By Loko

Rei do design-™ ØяiǥiиǺŁ ®

Colaboradores

Parceiros Link

Oque Vcs Acham Do Site?

Ŧop 3