Template:Team:HokkaidoU Japan/Book/JS
From 2014.igem.org
(Difference between revisions)
(42 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
- | |||
<script type="text/javascript"> | <script type="text/javascript"> | ||
Line 840: | Line 839: | ||
} )( jQuery, window ); | } )( jQuery, window ); | ||
+ | </script> | ||
+ | <script> | ||
+ | $(function(){ | ||
+ | var Page = (function() { | ||
+ | |||
+ | var config = { | ||
+ | $bookBlock : $( '#bb-bookblock' ), | ||
+ | $navNext : $( '#bb-nav-next' ), | ||
+ | $navPrev : $( '#bb-nav-prev' ), | ||
+ | }, | ||
+ | init = function() { | ||
+ | config.$bookBlock.bookblock( { | ||
+ | speed : 800, | ||
+ | shadowSides : 0.8, | ||
+ | shadowFlip : 0.7 | ||
+ | } ); | ||
+ | initEvents(); | ||
+ | }, | ||
+ | initEvents = function() { | ||
+ | |||
+ | var $slides = config.$bookBlock.children(); | ||
+ | // add navigation events | ||
+ | config.$navNext.on( 'click touchstart', function() { | ||
+ | config.$bookBlock.bookblock( 'next' ); | ||
+ | return false; | ||
+ | } ); | ||
+ | |||
+ | |||
+ | |||
+ | config.$navPrev.on( 'click touchstart', function() { | ||
+ | config.$bookBlock.bookblock( 'prev' ); | ||
+ | return false; | ||
+ | } ); | ||
+ | |||
+ | // add swipe events | ||
+ | $slides.on( { | ||
+ | 'swipeleft' : function( event ) { | ||
+ | config.$bookBlock.bookblock( 'next' ); | ||
+ | return false; | ||
+ | }, | ||
+ | 'swiperight' : function( event ) { | ||
+ | config.$bookBlock.bookblock( 'prev' ); | ||
+ | return false; | ||
+ | } | ||
+ | } ); | ||
+ | |||
+ | // add keyboard events | ||
+ | $( document ).keydown( function(e) { | ||
+ | var keyCode = e.keyCode || e.which, | ||
+ | arrow = { | ||
+ | left : 37, | ||
+ | up : 38, | ||
+ | right : 39, | ||
+ | down : 40 | ||
+ | }; | ||
+ | |||
+ | switch (keyCode) { | ||
+ | case arrow.left: | ||
+ | config.$bookBlock.bookblock( 'prev' ); | ||
+ | break; | ||
+ | case arrow.right: | ||
+ | config.$bookBlock.bookblock( 'next' ); | ||
+ | break; | ||
+ | } | ||
+ | } ); | ||
+ | }; | ||
+ | |||
+ | return { init : init }; | ||
+ | |||
+ | })(); | ||
+ | Page.init(); | ||
+ | |||
+ | }); | ||
</script> | </script> | ||
</html> | </html> |
Latest revision as of 14:06, 15 October 2014