Team:Shenzhen BGIC 0101
From 2013.igem.org
(Difference between revisions)
(105 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
+ | {{:Team:Shenzhen_BGIC_0101/Templates/Header}} | ||
<html> | <html> | ||
- | < | + | <head> |
+ | <script src="http://code.jquery.com/jquery-1.8.2.min.js" type="text/javascript"></script> | ||
+ | <script src="https://2013.igem.org/Team:Shenzhen_BGIC_0101/js/jquerycarouFredSel?action=raw&ctype=text/js" type="text/javascript"></script> | ||
+ | <script type="text/javascript"> | ||
+ | function prevTimers() { | ||
+ | return allTimers().slice( 0, $('#pager a.selected').index() ); | ||
+ | } | ||
+ | function allTimers() { | ||
+ | return $('#pager a span'); | ||
+ | } | ||
- | </ | + | $(function() { |
- | < | + | $('#carousel').carouFredSel({ |
+ | items: 1, | ||
+ | auto: { | ||
+ | pauseOnHover: 'resume', | ||
+ | progress: { | ||
+ | bar: '#pager a:first span' | ||
+ | } | ||
+ | }, | ||
+ | scroll: { | ||
+ | fx: 'crossfade', | ||
+ | duration: 300, | ||
+ | timeoutDuration: 6000, | ||
+ | onAfter: function() { | ||
+ | allTimers().stop().width( 0 ); | ||
+ | prevTimers().width( 140 ); | ||
+ | $(this).trigger('configuration', [ 'auto.progress.bar', '#pager a.selected span' ]); | ||
+ | } | ||
+ | }, | ||
+ | pagination: { | ||
+ | container: '#pager', | ||
+ | anchorBuilder: false | ||
+ | } | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | <style type="text/css"> | ||
- | { | + | #carousel { |
- | + | width: 750px; | |
- | + | height: 480px; | |
- | + | } | |
- | + | #carousel img { | |
- | + | border: 1px solid #ccc; | |
- | + | display: block; | |
- | + | padding: 10px; | |
- | + | float: left; | |
- | + | } | |
- | + | #pager { | |
+ | margin-top: 5px; | ||
+ | width: 750px; | ||
+ | } | ||
+ | #pager a, #pager span { | ||
+ | display: block; | ||
+ | height: 10px; | ||
+ | } | ||
+ | #pager a { | ||
+ | border: 1px solid #ccc; | ||
+ | width: 119px; | ||
+ | margin-right: 3px; | ||
+ | float: left; | ||
+ | } | ||
+ | #pager a:hover { | ||
+ | border-color: #999; | ||
+ | } | ||
+ | #pager span { | ||
+ | background-color: #ccc; | ||
+ | width: 0px; | ||
+ | } | ||
+ | |||
+ | #donate-spacer { | ||
+ | height: 100%; | ||
+ | } | ||
+ | #donate { | ||
+ | border-top: 1px solid #999; | ||
+ | width: 800px; | ||
+ | padding: 50px 75px; | ||
+ | margin: 0 auto; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | #donate p, #donate form { | ||
+ | margin: 0; | ||
+ | float: left; | ||
+ | } | ||
+ | #donate p { | ||
+ | width: 730px; | ||
+ | } | ||
+ | #donate form { | ||
+ | width: 100px; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | <h1 style="text-align:center;">This is our story!</h1> | ||
+ | |||
+ | <div id="wrapper"> | ||
+ | <div id="carousel"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/5/50/Frontpage1.png" width="720" height="477"/ > | ||
+ | <img src="https://static.igem.org/mediawiki/2013/9/91/Frontpage2.png" width="720" height="477" /> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/3/3d/Frontpage3.png" width="720" height="477" /> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/f/f7/Frontpage4.png" width="720" height="477" /> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/5/53/Frontpage5.png" width="720" height="477" /> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/f/f6/Frontpage6.png" width="720" height="477" class="last" /> | ||
+ | </div> | ||
+ | <div id="pager"> | ||
+ | <a href="#"><span></span></a> | ||
+ | <a href="#"><span></span></a> | ||
+ | <a href="#"><span></span></a> | ||
+ | <a href="#"><span></span></a> | ||
+ | <a href="#"><span></span></a> | ||
+ | <a href="#"><span></span></a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div style="text-align:center;clear:both"> | ||
+ | |||
+ | </div> | ||
+ | </body> | ||
+ | </html> |
Latest revision as of 19:10, 28 October 2013