lunes, 23 de marzo de 2009

TEXTO SIGUE RATON

Poner un texto que persiga al ratón por cualquier parte de la pantalla es muy fácil tal solo tendréis que seguir las siguientes indicaciones.

Primer paso:
Ve a Diseño->Nuevo Gadget->HTML/Javascript

Segundo paso: Tendrás que copiar el siguiente código.

<script language="JavaScript" type="text/javascript">
mensaje = 'Deja tus comentarios';
font = 'Arial';
size = 2;
color = 'red';
velocidad = 0.8;

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>

Tercer paso:(personalización)
No os asusteis por el código ya que lo único que tendréis que cambiar es:

mensaje: 'Escribir el que vosotros queráis'
font: podéis elegir entre Arial, Verdana, Helvetica, Comic Sans MS(es el tipo de letra)
size: tamaño de la letra
color: red, white, black, blue, green (color del texto)
velocidad: velocidad con que se mueven las letras.

28 Comentarios:

arleyco dijo...

Es posible que el texto solo aparezca en un area especifica no en todo el blog

caxitos dijo...

Aleyco Si que se puede, si te entendí bien lo que quieres hacer es una marquesina, para ello lo puedes ver aquí http://sitiooriginal.blogspot.com/2009/02/desplazamiento-de-texto-marquesina.html
De todas formas si tiens alguna otra duda no dudes en preguntar Saludos!!

Yo dijo...

El texto solo aparece en la parte superior, me gustaria que se moviera hasta el final de la entrada, si me ayues cn eso te lo agradeceria, pero de todas formas ya lo estoy usando gracias

caxitos dijo...

Yo Entré en tu blog y vi el texto que sigue al cursor, no se exactamente que es lo que quieres hacer, quizás lo que me estás preguntando sea una marquesina? mira en mi blog el apartado marquesina a ver si es lo que estás buscando, en caso contrario no dudes en preguntar de nuevo.

RuBéN dijo...

holaa a mi lo q ma pasa esque se me queda el texto en la parte de arriba y yo quiero q el texto siga a el puntero por todo la pagina no solo por la parte de arriba!!
graciaas ;)

caxitos dijo...

Ruben Si sigues los pasos no tendría que verse arriba, el código es correcto. Es posible que sea cosa de tu explorador, prueba a actualizarlo y despúes inserta el código un saludo ya me dices como fue.

Bellay dijo...

Hola, quisiera saber como puedo publicar en una entrada un video de Youtube y texto. Estoy preparando unos videos musicales (youtube) y quiero comentarlos en la misma entrada pero no me deja hacerlo. Solo puedo o poner los videos o el texto. nunca las 2 cosas.
AGRADECERIA ME AYUDARAÍS, ES URGENTE PARA UN POSIBLE TRABAJO.

xoxo

Bellay

caxitos dijo...

Bellay No se como insertas tu los videos pero no entiendo por que no puedes insertar video y texto, lo único que tienes que hacer es copiar el código del video de youtube y a continuación del código el texto que desees, puedes consultar estas entradas que quizás te aclaren algo.

Insertar Videos

caxitos dijo...

Bellay No se como insertas tu los videos pero no entiendo por que no puedes insertar video y texto, lo único que tienes que hacer es copiar el código del video de youtube y a continuación del código el texto que desees, puedes consultar estas entradas que quizás te aclaren algo.

Insertar Videos

Old School Generation dijo...

Hola, muy interesante tu blog. Una pregunta, si es posible realizar ese efecto con un texto, también debe ser posible hacer lo propio con una imagen verdad? Creo que sería interesante conseguir que un gif siga al puntero del ratón. Sabes por un casual cúales serían los cambios necesarios para conseguir tal efecto?

caxitos dijo...

Old School Generation Si que se puede claro que si, sinceramente no es algo que le vea mucha utilidad ya que al final acaba siendo muy engorroso, haré una entrada explicando como se hace para aquellos que lo necesiten, cuando la hago te avisaré un saludo.

Kco~ dijo...

Hola me gustaria mucho a mi tambien, saber como puedo en vez de la "frase" que sigue el mouse, agregar un gif

super vid dijo...

por favor donde se coloca eso de las letras en que parte de ese monton de letras del ht...

Juan José Morales dijo...

Hola me sale el texto arriba en la barra del blog, sin opción a que siga al ratón, despues de intentarlo en varias ocasiones no lo he logrado.

Mi pregunta es: ¿donde coloco el Gadget?, ya que he probado en varias ubicaciones y no da resultado siempre sale el texto en la barra antes mencionada, me gustaría disfrutar de éste truco,gracias,
Saludos: Juan José

caxitos dijo...

super vid Peobé nuevamente el código y dunciona perfectamente.

El código debes insertarlo en un gadget de tipo HTML/Javascript.

Juan José Morales dijo...

HTML/Javascript, si ésto ya lo sé, pero no hay manera, es mas, ahora lo he vuelto a hacer despues de unas cuantas horas y ya no sale ni el texto en la parte superior de la barra del blog como antes, ¿Que hago?

caxitos dijo...

Juan José Es muy provable que se no te sale sea por que tengas una version muy antigua de explorador. Prueba a actualizar tu internet explorer o firefox. Como siempre nosotros aconsejamos Firefox que es el mejor explorador desde nuestro punto de vista. Yo lo acabo de probar en los 2 navegadores y funciona perfectamente.

Anónimo dijo...

como evitar que suceda esto
sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss

Sol dijo...

PPOR QUE EL TEXTO QUEDA TAN SEPARADO DEL CURSOR?? :(
¿COMO PUEDO HACER PARA QUE QUEDE MÁS JUNTITO?? :)

caxitos dijo...

SOL Entré a tu blog y no vi lo que indicas de las letras separadas, yo he probado este script y las letras se veian bien..

Anónimo dijo...

soy mariano
i a mi me funciona!!
pero aparece debajo del cursor
y muy lejos
como lo pongo al lado y pegado

Marco dijo...

olle y como le doy efectos para que gire y toda la cosa xD como aqui http://sinthya.jimdo.com/plantillas-ice-blue-1/ a joder creo que es spam ¬¬

• ●๋• Icenik Dusseau • ●๋• dijo...

Dios, estoy desesperada... Intento todo y el (perdón por la expresión, pero ya estoy cabreada) maldito texto no se deja colocar; he intentado creo que con todos los códigos que hay por varias webs ùwu... Y Lo único que me me pasa es

a) Si lo coloco como gadget (html/script) no sale ni madres
b) Si lo inserto en la plantilla del código html me sale mensajes de errores, uno de ellos, con el código que das es éste:

"No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The content of elements must consist of well-formed character data or markup."

Y sabés algo? YA ME ESTRESÉ!! Te agradecería enormemente si podés ayudarme con ésto.

caxitos dijo...

Icenik Hola, no te pongas nerviosa! :) Si lo insertas en el código de la plantilla es normal que te de ese error que comentas, lo que debes de hacer es como bien dices es crearlo en un gadget tipo HTML/Javascript! te recomiendo que copies y pegues el código y revises que está correctamente linea. Hazlo y si sigues con el problema vuelve a escribir y intentaremos solucionar el problema ;) Un saludo!

Oscar Andujar dijo...

¿Se podría configurar el código html para que las letras salgan entorno al puntero pero solo al pasar varios segundos quieto el mouse?
Gracias de antemano, un saludo!^^

Publicar un comentario en la entrada

Haga su comentario

Bienvenido al Rincon del Blog
Tus comentarios nos ayudan a mejorar
Muchas Gracias por Comentar.