What this does is sets the body to not display, then fades it in.
Then once you click a link which you have deemed worthy of making the page fade out, it first prevents the default, which is instantly going to that link, and sets the variable new Location to be the href attribute of the currently clicked link. Then the body fades out and after the fade out it calls function newpage().
Try that puppy out.
Sorry I have a bit too much fun when it comes to js/jquery, I’m still learning myself so it’s a learning experience for both of us!
Dear tomscustoms, thanks for the update. I have not been able to get the FadeOut work at all! When a button is clicked, current page immediately disappears (doesn’t fadeout) and the new page nicely fades in. Have you tested above code? is there a way to fix it? Thanks.
I was just playing around with the code and I think I know what you’re looking for to make the page fade out when the link is clicked to go to another page – you just need to add the class=”link” to your “a” tag in the html.
see where tomscustoms wrote this line of code:
it could have been written like this as well:
the “.link” is the class that needs to be added to any “a” tag(s) in your html that you would like to execute the fade out function while leaving the current page.
Yeah , well I don’t quite recommend doing this for an enterprise project or a blog or an e-commerce website. Crap, I don’t recommend doing this at all. If the user doesn’t have JS enabled there is NO content for him what-so-ever. It is always good to have a fallback. So you can use modernirz to set the display to visible if there is no JS active.