RichardMass
asked on
Page transitions (fade in/out) with JQuery
Hi everyone,
I was wondering if anyone had any good pointers for using JQuery to achieve page transitions (ie: Once page is loaded, page fades in, then on link click the page fades out and fades in the next page).
I have been using scriptaculous to achieve this with some success however I am finding that lots of componants are just flashing in order out so looking to change languages to something with a little bit more "punch" to it.
Any suggestions regardless of scripting language would be greatly appreciated. An example of my current scriptaculous page transition can be seen at www.richardmassey.com.au
I was wondering if anyone had any good pointers for using JQuery to achieve page transitions (ie: Once page is loaded, page fades in, then on link click the page fades out and fades in the next page).
I have been using scriptaculous to achieve this with some success however I am finding that lots of componants are just flashing in order out so looking to change languages to something with a little bit more "punch" to it.
Any suggestions regardless of scripting language would be greatly appreciated. An example of my current scriptaculous page transition can be seen at www.richardmassey.com.au
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
That's fantastic, thank you so much. I've been able to pick your example apart and work out what does what and it has helped with playing with other functions as well.
Thank you heaps. I'm sure I will have more question on EE regarding JQuery but you have given me a great start.
Thank you heaps. I'm sure I will have more question on EE regarding JQuery but you have given me a great start.
Not to knock Scriptaculous, but I have found jQuery to be more compatible in general.
Here is how to hide, fade in, and fade out.
$(document.body).hide();
$(document.body).fadeIn();
$(document.body).fadeOut()