Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: IMPEESA en 25 Septiembre 2011, 15:28 pm



Título: Texto siguiendo puntero en html (duda)
Publicado por: IMPEESA en 25 Septiembre 2011, 15:28 pm
buenas
tengo una duda sobre un codigo que encontre en esta pagina
supuestamente es para que un texto siga al puntero del raton
creo que me he equivocado, en algo porque no me funciona
no estoy seguro

aqui les dejo el codigo:


<html>
<head>
<title>Texto siguiendo tu puntero</title>
</head>
<body>

<style>

.spanstyle {

   position:absolute;

   visibility:visible;

   top:-50px;

   font-size:9pt;

   font-family:Tahoma;

      font-weight:bold;

   color:blue;

}

</style>

<script>





var x,y

var step=20

var flag=0



// Tienes que dejar un espacio al final de tu mensaje!!!!!

var message="Tu mensaje va aqui... "

message=message.split("")



var xpos=new Array()

for (i=0;i<=message.length-1;i++) {

   xpos=-50

}



var ypos=new Array()

for (i=0;i<=message.length-1;i++) {

   ypos=-50

}



function handlerMM(e){

   x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX

   y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY

   flag=1

}



function makesnake() {

   if (flag==1 && document.all) {

       for (i=message.length-1; i>=1; i--) {

            xpos=xpos[i-1]+step

         ypos=ypos[i-1]

       }

      xpos[0]=x+step

      ypos[0]=y

   

      for (i=0; i<message.length-1; i++) {

          var thisspan = eval("span"+(i)+".style")

          thisspan.posLeft=xpos

         thisspan.posTop=ypos

       }

   }

   

   else if (flag==1 && document.layers) {

       for (i=message.length-1; i>=1; i--) {

            xpos=xpos[i-1]+step

         ypos=ypos[i-1]

       }

      xpos[0]=x+step

      ypos[0]=y

   

      for (i=0; i<message.length-1; i++) {

          var thisspan = eval("document.span"+i)

          thisspan.left=xpos

         thisspan.top=ypos

       }

   }

      var timer=setTimeout("makesnake()",30)

}



</script>

</body>
</html>



espero su ayuda
gracias


Título: Re: Texto siguiendo puntero en html (duda)
Publicado por: Z ZERO en 26 Septiembre 2011, 01:45 am
Hola proba con este pero este es en javascript espero que te sirva.

Código:
<script language="javascript" type="text/javascript">

mensaje = 'EL TEXTO QUE QUIERAS';
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>


Para cambiar la letra tenes que modificar el font, El tamaño de la letra en size y color en color. Saludos y Suerte


Título: Re: Texto siguiendo puntero en html (duda)
Publicado por: IMPEESA en 27 Septiembre 2011, 03:33 am
Muchas gracias por la respuesta "Z ZERO"
funciona sin problemas
y el efecto es muy bueno!!!