Difference between revisions of "Template:Team:TU Eindhoven/CloningGuideViewer HTML"
Jan Willem (Talk | contribs) |
Jan Willem (Talk | contribs) |
||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | <style> | ||
+ | .flipbook-viewport{ | ||
+ | overflow:hidden; | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | } | ||
+ | |||
+ | .flipbook-viewport .container{ | ||
+ | position:absolute; | ||
+ | top:50%; | ||
+ | left:50%; | ||
+ | margin:auto; | ||
+ | } | ||
+ | |||
+ | .flipbook-viewport .flipbook{ | ||
+ | width:922px; | ||
+ | height:600px; | ||
+ | left:-461px; | ||
+ | top:-300px; | ||
+ | } | ||
+ | |||
+ | .flipbook-viewport .page{ | ||
+ | width:461px; | ||
+ | height:600px; | ||
+ | background-color:white; | ||
+ | background-repeat:no-repeat; | ||
+ | background-size:100% 100%; | ||
+ | } | ||
+ | |||
+ | .flipbook .page{ | ||
+ | -webkit-box-shadow:0 0 20px rgba(0,0,0,0.2); | ||
+ | -moz-box-shadow:0 0 20px rgba(0,0,0,0.2); | ||
+ | -ms-box-shadow:0 0 20px rgba(0,0,0,0.2); | ||
+ | -o-box-shadow:0 0 20px rgba(0,0,0,0.2); | ||
+ | box-shadow:0 0 20px rgba(0,0,0,0.2); | ||
+ | } | ||
+ | |||
+ | .flipbook-viewport .page img{ | ||
+ | -webkit-touch-callout: none; | ||
+ | -webkit-user-select: none; | ||
+ | -khtml-user-select: none; | ||
+ | -moz-user-select: none; | ||
+ | -ms-user-select: none; | ||
+ | user-select: none; | ||
+ | margin:0; | ||
+ | } | ||
+ | |||
+ | .flipbook-viewport .shadow{ | ||
+ | -webkit-transition: -webkit-box-shadow 0.5s; | ||
+ | -moz-transition: -moz-box-shadow 0.5s; | ||
+ | -o-transition: -webkit-box-shadow 0.5s; | ||
+ | -ms-transition: -ms-box-shadow 0.5s; | ||
+ | |||
+ | -webkit-box-shadow:0 0 20px #ccc; | ||
+ | -moz-box-shadow:0 0 20px #ccc; | ||
+ | -o-box-shadow:0 0 20px #ccc; | ||
+ | -ms-box-shadow:0 0 20px #ccc; | ||
+ | box-shadow:0 0 20px #ccc; | ||
+ | } | ||
+ | </style> | ||
<script src="https://static.igem.org/mediawiki/2015/3/3b/Viewerscript.txt" type="text/javascript"> </script> | <script src="https://static.igem.org/mediawiki/2015/3/3b/Viewerscript.txt" type="text/javascript"> </script> | ||
<script src="http://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"> </script> | <script src="http://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"> </script> |
Revision as of 18:42, 15 September 2015