.gif&contenttype=gif)
Con estos ejemplos aprenderás a poner una imagen o un texto al lado del puntero del ratón.
El primer efecto es el más simple, puesto que solamente muestra una imagen estática junto al puntero. Tanto la imagen como el tamaño de esta se puede modificar cambiando el texto en negrita:
<html><script language="javascript">
<!--
B=document.all;
C=document.layers;
T1=new Array("imagen1.gif", 36 , 35 )
nos=parseInt(T1.length/3)
rate=50
ie5fix1=0;
ie5fix2=0;
for (i=0;i<nos;i++){
crearcontenedor("CUR"+i,i*10,i*10,i*3+1,i*3+2,"","<img src='"+T1[i*3]+"' width="+T1[(i*3+1)]+" height="+T1[(i*3+2)]+" border=0>") }
function crearcontenedor(N,Xp,Yp,W,H,At,HT,Op,St) {
with (document){
write((!B) ? "<layer id='"+N+"' left="+Xp+" top="+Yp+" width="+W+" height="+H : "<div id='"+N+"'"+" style='position:absolute;left:"+Xp+"; top:"+Yp+"; width:"+W+"; height:"+H+"; ");
if(St){
if (C)
write(" style='");
write(St+";' ")
}
else write((B)?"'":"");
write((At)? At+">" : ">");
write((HT) ? HT : "");
if (!Op)
cerrarcontenedor(N)
}
}
function cerrarcontenedor() {
document.write((B)?"</div>":"</layer>")
}
function getXpos(N) {
return (B) ? parseInt(B[N].style.left) : C[N].left
}
function getYpos(N) {
return (B) ? parseInt(B[N].style.top) : C[N].top
}
function movercontenedor(N,DX,DY) {
c=(B) ? B[N].style :C[N];c.left=DX;c.top=DY
}
function ciclo() {
if (document.all&&window.print){
ie5fix1=document.body.scrollLeft;
ie5fix2=document.body.scrollTop;
}
for (i=0;i<(nos-1);i++){
movercontenedor("CUR"+i,getXpos("CUR"+(i+1)),getYpos("CUR"+(i+1)))
}
}
function nuevaposicion(e) {
movercontenedor("CUR"+(nos-1),(B)?event.clientX+ie5fix1:e.pageX+2,(B)?event.clientY+ie5fix2:e.pageY+2)
}
if(document.layers)
document.captureEvents(Event.MOUSEMOVE)
document.onmousemove=nuevaposicion
setInterval(" ciclo() ",rate)
//-->
</script>
</body>
</html>
Usuarios que han visto este tema también han visto...
- Eventos de JavaScript
- Creador vínculo mailto anti SpamBots con JavaScript
- Javascript para recomendar página
- Modelos de almacenamiento de datos
- Operadores especiales en JavaScript
- Versión imprimible de este documento
- Enviar por e-mail este documento
Información legal | Política de Privacidad | Contacte con nosotros
Otro proyecto de Factoría de Internet. Copyright© 2003-2011 Factoría de Internet S.L.. Todos los derechos reservados.