Jquery, FadeIn before unload

Question

I'm trying to accomplish a transition effect if you will. On doc ready div fades out, the problem im having is when a visitor navigates away from the page (or .unload) I want the div to fade back in.

$(document).ready(function(){

$('#overlay').fadeOut(2000, 'easeOutQuad');

});

$(window).beforeunload(function() {

$('#overlay').fadeIn(2000, 'easeOutQuad');

});

Answer 1

beforeunload events are unreliable, you cannot make sure they are fully executed, because the differences in unload speeds across browsers and computers. Also, to achieve the fade-in effect, the unload must be delayed, which is not possible.