Send to a Friend

klaas4's avatar

JQuery: wait for other event to finish?

Asked by klaas4 (2186points) September 3rd, 2009

Hi all,

I have this code:

$(‘a’).click(function(){
$(’#photoViewer’).fadeOut(250);
$(’#photoViewer’).attr(‘src’,‘images/albums/photo.jpg);
$(’#photoViewer’).fadeIn(250);
});

The problem is that the 3rd line fired immediately and doesn’t wait for the fade (line 2) to finish. The same applies to the fadeIn on line 4 which doesn’t wait for line 3 to finish.

Simply put: I want to fade the #photoViewer. When fully faded out, it has to start loading the new images into #photoViewer. When the new image is fully loaded and ready to display, fade #photoViewer back in.

I guess you have to do this with callbacks, but I’ve had no luck. If anyone could help, I’d appreciate it.

Thanks! Davey.

Using Fluther

or

Using Email

Separate multiple emails with commas.
We’ll only use these emails for this message.