smooth transition between pages when redirecting with jquery

Question

I am trying to get a smooth transition when I redirect users. First by fading out the page then redirecting and and fadeIn.

Here is my redirect

if ( dat         


        

Answer 1

Don't use pure css to hide the content originally. If you do, users with JavaScript turned off will not see your content. Instead, only hide when javascript is available.

.js-enabled div.container_16,
.js-enabled .grid_16 {
  display: none;
}

Include this line of javascript at the very top of the body:

$(document.body).addClass('js-enabled');

Then in your animation function, after you've hidden .grid_16, include this line to return things to normal:

$(document.body).removeClass('js-enabled');

If you want, you can be more specific and target the hiding styles to the particular elements you want to hide. But I don't know if that's practical for your case -- too few details.