Verdaderamente cada dÃa me sorprende más todo lo que se puede lograr con el lenguaje, tan conocido, Javascript. Desde el sitio Blog Oh! Blog me encuentro con una serie de trucos de Javascript muy impresionantes y entretenidos.
De todos los que vi uno en particular me llamó mucho la atención por su gran poder y atractivo visual. El mismo se llama “The Big Wheelâ€, o la gran rueda, y consiste precisamente en una gran rueda que comienza a girar con todas las imágenes de una web.
¿Cómo funciona? Todo lo que tenemos que hacer es meternos en el sitio donde queremos probar este truco, copiar el siguiente código en la barra de direcciones de la web:
-
javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.getElementsByTagName("img"); DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=(Math.sin(R*x1+i*x2+x3)*x4+x5)+"px"; DIS.top=(Math.cos(R*y1+i*y2+y3)*y4+y5)+"px"}R++}setInterval('A()',5); void(0);
Y, finalmente, observar el aro de imágenes desplegarse.
Los mejores sitios para utilizarlo son aquellos que poseen muchas fotografÃas como un Fotolog, o las imágenes de Google, por ejemplo.
Si observan el código lo que rota es el tag “img†de HTML, asà que si lo reemplazan por “a†o “p†verán a los links o al texto rotar en lugar de las imágenes.
Entretenido ¿verdad?
Fuente: Blog Oh! Blog
Artículos relacionados
- Más consejos para crear una sección de Preguntas Frecuentes en tu sitio web
- Consejos para crear una sección de Preguntas Frecuentes en tu sitio web
- Efecto de zoom en las imágenes de tu sitio con Javascript
- Scripty2: Haz tu sitio web compatible con sistemas de pantalla multitouch
- e24Squares: transición en Ajax para la imágenes de tu galerÃa
Lunes, 10 de Noviembre de 2008 a las 22.06
Si utilizo el codigo que esta en el post, de ElWebmaster, no funciona.
Pero si uso el de la web original si.
saludos
Martes, 11 de Noviembre de 2008 a las 06.51
¿Cómo funciona? Todo lo que tenemos que hacer es meternos en el sitio donde queremos probar este truco, copiar el siguiente código en la barra de direcciones de la web:
Pues no funciona ...
Martes, 11 de Noviembre de 2008 a las 18.46
Sencillamente, perfecto!
Martes, 11 de Noviembre de 2008 a las 20.47
Esta muy bueno tu aporte pero lo probe y no pasa nada. Hay algo mas que tengo que hacer aparte de pegar el codigo en la barra de direcciones de una pagina y darle enter???
Jueves, 13 de Noviembre de 2008 a las 14.28
¡Hola! Prueben ahora que he pegado el código en modo plain. ¡No falla!
Jueves, 13 de Noviembre de 2008 a las 20.40
Wow!!! Esta Muy interesante... muy buen efecto, no sabia que desde mi navegador tambien puedo modificar el contenido de una web ya terminada... exelente..!
Domingo, 7 de Diciembre de 2008 a las 00.23
exelente..¡ java.. cada dia me sorplende mas
Lunes, 23 de Febrero de 2009 a las 13.22
saben no me funciona no se como hacerlo aver si me explican mejor a mi msn : acuario_elfirme@hotmail.com
ayuda
Jueves, 30 de Diciembre de 2010 a las 11.35
excelente.. gracia. esos trucos si que estan muy buenos y divertidos,, jajaj , saludos por alli