Tuesday, February 20, 2007

Make images fly with JavaScript

From ibzi's blog

JavaScript can be quite fun, especially when you can use it on websites you don’t even own. Let me explain — If you visit a website and then clear the address bar and enter something like javascript:alert('javascript rocks'); you will see that the JavaScript actually executes. Try some of these examples (Just enter it into the address bar and Enter.):


Keeping this in mind, you can go to great lengths. In fact, have a look at what code I came across. When you enter this code into your browser, the images start to fly in a solar-system like way. Try it out.

Flying images on Amazon.com

Here is the JavaScript for it, just copy it into your address bar and enter. Take note that this effect doesn’t work for all sites, so don’t start restarting your browsers/computer if one site doesn’t work.

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.images; 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; DIS.top=Math.cos(R*y1+i*y2+y3)*y4+y5}R++}setInterval('A()',5); void(0);