Question

Possible Duplicate:
Can someone Explain this jQuery code?

I have posted this before, but I would like to refine my question (and I can’t seem to do it in the old thread).

The code is:

$(document).ready(function()
    {
            var rot=$('#image3').rotate({maxAngle:25,minAngle:-55,
            bind:
                    [
                            {"mouseover":function(){rot[0].rotateAnimation(85);}},
                            {"mouseout":function(){rot[0].rotateAnimation(-35);}}
                    ]
            });
    });

It’s taken from here: http://wilq32.googlepages.com/wilq32.rollimage222, and there’s a demo of the functionality there as well (animating an image rotation – the 3rd demo on the page).

What I need explained:

1. I understand that there’s a variable being declared -“rot“, but I can’t seem to understand where the declaration ends….

2. When the variable is used, it is used as rot[0], what does [0] stands for? is this an array?

3. I’ve never seen bind used like that, the original syntax is

   $(“selector”).bind( type, [data], fn );

What’s going on, then? What are all the commas and [ ] about?

4. What I’d like to do, eventually, is use this script to rotate image “X”, while “Y” element is being clicked. How can this be done (preferably without “bind”)?

Thanks!

Answer 1

I think the basic syntactic issues have been explained by others here quite well…

In terms of:

What I’d like to do, eventually, is
use this script to rotate image “X”,
while “Y” element is being clicked.
How can this be done (preferably
without “bind”)?

Try this:

var x=$("#imagex"); //<-- image to be rotated
var y=$("#elemy"); //<-- element to be clicked
var angleOfRotation=45; //<-- angle of rotation

y.bind("click",function(){
  x[0].rotateAnimation(angleOfRotation);
});