FadeIn and FadeOut effect weird

Question

I am using JQuery and what I want to happen is: div fades out using fadeOut() . It then loads content from a url using the load() . Then once content loaded it fades back in using fadeIn() . However it does not work,it flashes then loads out then loads in. I think the problem is that the fading is happening before the load is complete.I saw that someone else had the same problem but when i applied their solution there was no change.Here is the code with the solution i found (not working of course).

jQuery('.stil_link_img a').click(function() {
    var x  = jQuery(this).attr('href') + ' #continut_eco';
    jQuery('#continutul_paginii').fadeOut("slow").load(x,function() {
        jQuery(this).fadeIn("slow")
    });
    return false      
});

Answer 1

you could try:

jQuery('.stil_link_img a').click(function(){
   var x = jQuery(this).attr('href') + ' #continut_eco ',
   $this = jQuery('#continutul_paginii');
   $this.fadeOut("slow", function() {
       $this.load(x, function() {
           $this.fadeIn("slow")
       });
   });
});

Answer 2

The fadeout function accepts a callback function, called when the transition is done.

You could do something like this :

jQuery('#continutul_paginii').fadeOut("slow",myFunction)

And load your stuff in myFunction.

More infos here :

http://api.jquery.com/fadeOut/