Mercurial > hg > Papers > 2015 > kaito-lola
diff presentation/js/jquery.slideshow.transition.js @ 3:c50a033e6635
create presentation slide
author | Kaito Tokumori <e105711@ie.u-ryukyu.ac.jp> |
---|---|
date | Wed, 01 Jul 2015 19:06:07 +0900 |
parents | |
children |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/presentation/js/jquery.slideshow.transition.js Wed Jul 01 19:06:07 2015 +0900 @@ -0,0 +1,38 @@ + +function transition( $from, $to ) { + $from.hide(); + $to.show(); +} + +function transitionSlideUpSlideDown( $from, $to ) { + $from.slideUp( 500, function() { $to.slideDown( 1000 ); } ); +} + +function transitionFadeOutFadeIn( $from, $to ) { + $from.fadeOut( 500 ); + $to.fadeIn( 500 ); +} + +/*********************** + * sample custom transition using scrollUp effect + * inspired by Karl Swedberg's Scroll Up Headline Reader jQuery Tutorial[1] + * [1] http://docs.jquery.com/Tutorials:Scroll_Up_Headline_Reader + */ + +function transitionScrollUp( $from, $to ) { + var cheight = $from.outerHeight(); + + // hide scrollbar during animation + $( 'body' ).css( 'overflow-y', 'hidden' ); + + $to.css( 'top', cheight+'px' ); + $to.show(); + + $from.animate( {top: -cheight}, 'slow' ); + $to.animate( {top: 0}, 'slow', function() { + $from.hide().css( 'top', '0px'); + + // restore possible scrollbar + $( 'body' ).css( 'overflow-y', 'auto' ); + }); +} \ No newline at end of file