How to make the images fly all over ?

[tefflox]

Hi, I have taken the following code from youtube. As it is, without the function wrapper, it work in the address bar, tho I would like to modify it and call it to operate in one of my own pages. I need help to figure out how this can be done.

function gyrate() {

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);

}

[MidiMagic]

Hi, I have taken the following code from youtube. As it is, without the function wrapper, it work in the address bar, tho I would like to modify it and call it to operate in one of my own pages. I need help to figure out how this can be done.

I took it apart to see how it works:

function gyrate() {
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);
};

The main caveat is that you not use any of these variables elsewhere in your code. It will move all of the images already on the page.

The x4, y4, x5, and y5 values may have to be adjusted to fit your particular images.

[tefflox]

The code is meant to move the images on the page. What I've done so far is load the images, in the standard way: <img src="1.jpg"/>... then call the function:

<script type="text/javascript">
  gyrate();
</script>

but it doesn't work.

[MidiMagic]

Where is this script located in your code?

It must be below the place where the images are loaded, or the script will run before the images load (and it won't find any).

It's also possible that your browser has settings to prohibit recursive functions (It's a common worm propagation method).

[tefflox]

I've used the function in the address bar at amazon, google, flickr, etc, and it works. I had the script loaded below the images, and it doesn't work. Tho I think it may be over the top, for my purposes. The journal I edit, listenlight.net, is a minimalist production. Thanks for your time.

[hinkoii]

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);

voila

[shaveenk]

Older versions of Javascript were ok with not having semicolons for the last statement of a scope. This is not true anymore. Try this it should work:

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);