Question

I saw this code in another question , I thought I might make it work for an image too, but since I am a newbie in jquery, I didn’t do much.

Here is the code:

$('someObject').bind('mouseover', function() {

    //Do the following while mouseover 
    $('someOtherObject').css('margin-left',adjustedLeft + 'px');
    setTimeout(/*do it again*/,25);

});

I saw it in this question right here:
An "if mouseover" or a "do while mouseover" in JavaScript/jQuery

There is an example below it also, but that one works for text fields.

I want mine to work for images, basically i have 2 images one over another and i want to make a fading effect, so something like

while mouseover , every 0,01sec , lower the opacity by 0.01 ,till 0,01
the moment the mouse leaves the image(button) , stop lowering the opacity and start heightening it again by 0.01 every 0.01sec till 0.99 opacity

Just to be clear again , i got 2 images(buttons) 1 above the other , i want to lower and then heighten the opacity of the upper button.
Also i saw another type of fade , but the 2 buttons were on 1 image , but for me(the newbie) its too advanced i guess, but i might look at that , its a nice way to use less images i guess.

Just in case , here is the link to the example too : http://jsfiddle.net/YjC6y/29/

Answer 1

$('someObject').mouseover(function() {
   $('someOtherObject').animate({
         opacity: 0
    })
}).mouseout(function() {
   $('someOtherObject').animate({
         opacity: 0.99
    })
});