Fade Out Before Changing Pages?

JavaScript
1

I’m able to fade in content fine with this

$('#burrito').animate({'opacity' : 0}, 0);
   fadeInDivs(['#burrito']);


function fadeInDivs(els) {
    e = els.pop();
    $(e).delay(750).animate({'opacity' : 1}, 1000, function(){
        if (els.length) fadeInDivs(els);
    })
}

but how do I fade out the #burrito div before the page changes?

2

Are you sure you really want to do that because it’ll delay the new page being opened to the user by the time it takes to fade out the div? It could be very annoying for some users (including me :lol:).

But in any case, you could put an onclick event handler on a link that first fades out the div and then redirects to the target page for the link.

3

I absolutely agree with what webdev1958 is saying. When working on my site I found it very annoying to have a 100ms page fade in and got rid of it.