Question: I'm having an issue using the fadeIn and fadeOut of my web pages using jQuery. When the script runs my page fades out and then I get a white flash and then my new page fades in. Is this typical for this jQuery effect? It's kind of an issue for me because the site is very dark with a black background so it's quite jarring.

Below is my script that I'm using to run these effects. Could it be an issue with the page redirecting that is generating this? Is there a more effective way of doing this?

```
$(document).ready(function() {

    $("body").css("display", "none");

    $("body").fadeIn(2000);

    $("a.transition").click(function(event){
        event.preventDefault();
        linkLocation = this.href;
        $("body").fadeOut(1000, redirectPage);      
    });

    function redirectPage() {
        window.location = linkLocation;
    }

});

```

Thanks in advance guys. Appreciate the help.

Patrick

Answer: 
When the fadeOut animation completes it will set display:none on body. This is probably the source of your white flash. Try wrapping your entire page inside a div within the body, and fading that div out.

Or try applying this CSS:

```
html,body {
  background-color:#000;
}

```
Have you tried using slower or faster fadeOut values? It seems like using a slower speed may help, but I haven't tested it so I can't say for sure. 
Could also try adding the pseudo selector :visible to the call so that it only selects currently visible items. Example:

```
$("a.transition").click(function(event){
        event.preventDefault();
        linkLocation = this.href;
        $("body:visible").fadeOut(1000, redirectPage);      
    });

```