Question

my image is at some div, and it’s z-index is the highest

When i click on something, I want it to fade out, and fade in on another, specified position. Below the image of another class : ) It’s an “aaa” class.

I was doing it like that:

          $('img.classy').fadeOut();
          $('img.classy').css('top',$(el).find('img.aaa:last').height()+60);
          $('img.classy').fadeIn();

It’s embedded to click event. When I run it and click the area, img.classy FIRSTLY changes it’s position, then on new position it fades out and fades in. I want obviously to make it that way: fade out -> change position when invisible -> fadein on new position. how to do it?

Answer 1

You need to wait until the fadeOut is complete. I added a callback function for you.

$('img.classy').fadeOut('slow', function() {
    $(this).css('top',$(el).find('img.aaa:last').height()+60);
    $('img.classy').fadeIn();
});