Si quieres que en tu blog de blogger aparezca un texto que persiga al cursor del ratón tan sólo debes copiar el siguiente script en Diseño -> Elementos de página -> Añadir un gadget (no os preocupéis porque no aparecerá como un gadget)
<script language="JavaScript" type="text/javascript">
mensaje = 'EL TEXTO QUE QUIERAS';
font = 'Verdana,Arial';
size = 3;
color = 'black';
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>
Mira un ejemplo de cómo quedan unas palabras que persiguen al ratón.
Gracias una vez más al compañero El Potro.
no entendi lo podrias explicarte mejor, no entendi lo porque copio el codigo y lo pego en un gagest pero no sale el texto. plis explica mejor el post
ResponderEliminarHola. Te recomiendo que tengas un blog de pruebas para probar este tipo de trucos.
ResponderEliminarDebes copiar todo ese código, siguiendo los pasos descritos en la entrada, en un gadget HTML/Javascrip, da igual donde lo coloques porque aparecerá después de guardar los cambios.
Un saludo, coméntame a ver cómo te ha ido.
Yo lo copio y pego, pero no me sale.
ResponderEliminartnego que cambiar algo?
Hola Ayacuyito. Por lo que me cuentas, parece que en tu blog hay algún script que hace que no funcione este "truco".
ResponderEliminarEn breve publicaré otro script alternativo a este para soluciona a quien no les funcione el código de esta entreda.
Estáte atento al blog. Un saludo y disculpa las molestias.
Muchas gracias estare atento!
ResponderEliminarGracias a ti Ayacuyito. Un saludo.
ResponderEliminarami tampoco me sale :(
ResponderEliminarHola. Te felicito por tu página.Me han gustado todos los trucos y los he realizado en mi blog. Tuve problemas con el texto en el puntero porque me sale muy lejos. Agradezco de antemano toda la ayuda posible para mejorar este error. Gracias.
ResponderEliminarA los que no os funcione probad con el siguiente código. Ponedlo antes de /head
ResponderEliminar<script language='javascript' type='text/javascript'>
//Cursor con texto en movimiento
//<![CDATA[
var x,y
var tempo = 10
var espera = 0
var texto = "Aquí va tu texto"
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){
//si no es NS4, usa objeto window.event
if (!e) var e = window.event
//NS4
if (e.pageX || e.pageY) {
x = e.pageX
y = e.pageY
window.status = x + ' : ' + y
//IE y compatibles con DOM
} else if (e.clientX || e.clientY) {
x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft
y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop
window.status = x + ' : ' + y
//no soportado, no hace nada
} else {
return
}
espera = 1
}
function animar_cursor() {
if ( espera == 1 ) {
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
}
//para el IE 4.x
if ( espera==1 && document.all ) {
for (i = 0; i <= texto.length - 1; i++) {
var letra = eval("span" + i + ".style")
letra.posLeft = xpos[i]
letra.posTop = ypos[i]
}
}
//para el Netscape 4.x
else if ( espera==1 && document.layers ) {
for (i = 0; i <= texto.length - 1; i++) {
var letra = eval("document.span" + i)
letra.left = xpos[i]
letra.top = ypos[i]
}
}
//para navegadores compatibles DOM
else if ( espera==1 && document.getElementById ) {
for (i = 0; i <= texto.length - 1; i++) {
var letra = document.getElementById( "span" + i)
letra.style.left = xpos[i] + 'px'
letra.style.top = ypos[i] + 'px'
}
}
var timer = setTimeout("animar_cursor()", 30)
}
if (document.layers)
document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = seguir
//]]>
</script>
<style type='text/css'>
.cursoranimado {
position:absolute;
visibility:visible;
top:-50px;
font-size:11pt;
font-family:Arial;
font-weight:bold;
color:red;
}
</style>
<script language='javascript' type='text/javascript'>
//<![CDATA[
if (document.layers) {
for (i=0;i<=texto.length-1;i++) {
document.write('<span id="span' + i + '" class="cursoranimado">')
document.write(texto[i])
document.write('</span>')
}
} else if (document.all || document.getElementById) {
for (i=0;i<=texto.length-1;i++) {
document.write('<div id="span' + i + '" class="cursoranimado">')
document.write(texto[i])
document.write('</div>')
}
}
animar_cursor()
//]]>
</script>
el codio me funciona pero las letras se me van para el lado
ResponderEliminar