jQuery fade in/out on web app
I have used Padilicious to allow a swipe on my homepage of an ipad webapp to load the news page but what I want 开发者_如何学运维to do is have the homepage fade out when the user swipes and then the news page fade in when it loads. I know how to get the news page to fade in but cannot get the homepage to fade out when the swipe is detected.
Have you tried simply using the fadeOut()
function?
$("#containingDiv").fadeOut()
So putting this into the code from padalicious you would have something like this which fades out when someone swipes to the right - but you can easily move it around that function
function processingRoutine() {
var swipedElement = document.getElementById(triggerElementID);
if ( swipeDirection == 'left' ) {
// REPLACE WITH YOUR ROUTINES
swipedElement.style.backgroundColor = 'orange';
} else if ( swipeDirection == 'right' ) {
// REPLACE WITH YOUR ROUTINES
$("#containingDiv").fadeOut()
swipedElement.style.backgroundColor = 'green';
} else if ( swipeDirection == 'up' ) {
// REPLACE WITH YOUR ROUTINES
swipedElement.style.backgroundColor = 'maroon';
} else if ( swipeDirection == 'down' ) {
// REPLACE WITH YOUR ROUTINES
swipedElement.style.backgroundColor = 'purple';
}
}
精彩评论