Difference between revisions of "Team:ZJU-China"
Line 117: | Line 117: | ||
<div class="row"> | <div class="row"> | ||
<div class="col-md-6"><div class="block2" data-scale="5" > | <div class="col-md-6"><div class="block2" data-scale="5" > | ||
+ | {{:Team:ZJU-China/template/head}} | ||
+ | <html> | ||
+ | <head> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Team:ZJU-China/css/home/ZJU-bootstrap.css?action=raw&ctype=text/css" /> | ||
+ | |||
+ | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Team:ZJU-China/css/home/ZJU-component.css?action=raw&ctype=text/css" /> | ||
+ | |||
+ | <script type="text/javascript" src="https://2015.igem.org/Team:ZJU-China/js/home/ZJU-modernizr.custom.js?action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript" src="https://2015.igem.org/Team:ZJU-China/js/home/ZJU-classie.js?action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript" src="https://2015.igem.org/Team:ZJU-China/js/home/ZJU-boxesFx.js?action=raw&ctype=text/javascript"></script> | ||
+ | |||
+ | <script src="js/ZJU-jquery-1.11.0.min.js"></script> | ||
+ | |||
+ | <script type="text/javascript"> | ||
+ | $(document).ready(function(){ | ||
+ | $('a[href^="#"]').on('click',function (e) { | ||
+ | e.preventDefault(); | ||
+ | |||
+ | var target = this.hash, | ||
+ | $target = $(target); | ||
+ | |||
+ | $('html, body').stop().animate({ | ||
+ | 'scrollTop': $target.offset().top | ||
+ | }, 900, 'swing', function () { | ||
+ | window.location.hash = target; | ||
+ | }); | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | </head> | ||
+ | <body style="min-width:1400px;background-image: url(https://static.igem.org/mediawiki/2015/a/ab/ZJU-background.jpg);"> | ||
+ | <!--<body style="overflow:scroll;overflow-y:hidden;min-width:1400px;background-image: url(https://static.igem.org/mediawiki/2015/a/ab/ZJU-background.jpg);">--> | ||
+ | <div class="container1" > | ||
+ | |||
+ | <div id="boxgallery" class="boxgallery" data-effect="effect-1"> | ||
+ | <div class="panel"><img src="https://static.igem.org/mediawiki/2015/d/d1/ZJU-home-2.png" alt="Image 1"/></div> | ||
+ | <div class="panel"><img src="https://static.igem.org/mediawiki/2015/d/d2/ZJU-home1.png" alt="Image 2"/></div> | ||
+ | <div class="panel"><img src="https://static.igem.org/mediawiki/2015/e/e8/ZJU-home-3.png" alt="Image 3"/></div> | ||
+ | <div class="panel"><img src="https://static.igem.org/mediawiki/2015/b/bb/ZJU-home-4.png" /></div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <script> | ||
+ | new BoxesFx( document.getElementById( 'boxgallery' ) ); | ||
+ | </script> | ||
+ | |||
+ | <div style="position: relative;top: 80%;text-align: center; width: 100%;height: 0;z-index: 99;"><a href="#intro"><img src="https://static.igem.org/mediawiki/2015/0/09/ZJU_down.png" style="width:10%;height:40px;" /></a></div> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Team:ZJU-China/css/home/ZJU-home-Intro.css?action=raw&ctype=text/css" /> | ||
+ | |||
+ | <style type="text/css"> | ||
+ | |||
+ | .divcss5_list_title{border:1px solid #cccccc; padding:1em;} | ||
+ | |||
+ | .divcss5_list_content{padding:1em;} | ||
+ | |||
+ | #tinybox{position:absolute; display:none; padding:10px; background: url(https://static.igem.org/mediawiki/2015/2/2f/Loading3.gif) no-repeat 50% 50%;z-index:2000;background-size:100px 100px;width:1000px;} | ||
+ | |||
+ | #tinymask{position:absolute; display:none; top:0; left:0; height:100%; width:100%; background:rgb(51,51,51); z-index:1500;} | ||
+ | |||
+ | #tinycontent{font-size:1.1em;} | ||
+ | |||
+ | #n{margin:10px auto; width:920px; border:1px solid #CCC;font-size:12px; line-height:30px;} | ||
+ | |||
+ | #n a{ padding:0 4px; color:#333} | ||
+ | |||
+ | #tinycontent img{ | ||
+ | width:1000px; | ||
+ | height:600px; | ||
+ | } | ||
+ | |||
+ | |||
+ | #tinycontent img{ | ||
+ | width:1000px; | ||
+ | height:600px; | ||
+ | } | ||
+ | |||
+ | #tinycontent #content{ | ||
+ | position:absolute; | ||
+ | left:-120%; | ||
+ | |||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | <script type="text/javascript" src="https://2015.igem.org/Team:ZJU-China/js/home/ZJU-tinybox.js?action=raw&ctype=text/javascript"></script> | ||
+ | |||
+ | <script type="text/javascript">function getValue1(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/2/25/ZJU-Card1.png' />";TINY.box.show('https://2015.igem.org/Team:ZJU-China/Page-in/test',1,300,150,1)}</script> | ||
+ | <script type="text/javascript">function getValue2(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/8/88/ZJU-Card2.png' />";TINY.box.show(task,0,0,0,1)}</script> | ||
+ | <script type="text/javascript">function getValue3(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/5/5e/ZJU-Card3.png' />";TINY.box.show(task,0,0,0,1)}</script> | ||
+ | <script type="text/javascript">function getValue4(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/a/a3/ZJU-Card4.png' />";TINY.box.show(task,0,0,0,1)}</script> | ||
+ | <script type="text/javascript">function getValue5(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/2/25/ZJU-Card1.png' />";TINY.box.show(task,0,0,0,1)}</script> | ||
+ | <script type="text/javascript">function getValue6(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/8/88/ZJU-Card2.png' />";TINY.box.show(task,0,0,0,1)}</script> | ||
+ | <script type="text/javascript">function getValue7(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/5/5e/ZJU-Card3.png' />";TINY.box.show(task,0,0,0,1)}</script> | ||
+ | <script type="text/javascript">function getValue8(){ | ||
+ | var task = "<img src='https://static.igem.org/mediawiki/2015/a/a3/ZJU-Card4.png' />";TINY.box.show(task,0,0,0,1)}</script> | ||
+ | |||
+ | <div class="wrap" > | ||
+ | <div class="container" id="intro"> | ||
+ | |||
+ | |||
+ | <h2 class="hh2">INTRODUCTION</h2> | ||
+ | <div class="row"> | ||
+ | <div class="col-md-6"><div class="block2" data-scale="5" > | ||
+ | <h2 class="intro-in-h">Why we choose termites?</h2> | ||
+ | <p class="intro-in-p"> | ||
+ | Termites are widely recognized as the 5th pest around the world, | ||
+ | based on its astonishing number and incredible damage towards wood. | ||
+ | Given that a termite weighed 1 gram, | ||
+ | then everyone should own 500 thousand termites! | ||
+ | Owing to their wood-eating habits, | ||
+ | termites are terminators of crops, | ||
+ | trees, buildings, river dams; | ||
+ | and more often, spoil people’s life. | ||
+ | </p> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col-md-6"><div class="block2" data-scale="0.2" data-skew="90deg,90deg"> | ||
+ | |||
+ | |||
+ | </div></div> | ||
+ | </div> | ||
+ | |||
+ | <div class="row"> | ||
+ | <div class="col-md-6"><div class="block2" data-rotate-y="270deg" data-move-x="-150%"> | ||
+ | |||
+ | |||
+ | </div></div> | ||
+ | <div class="col-md-6"><div class="block2" data-rotate-y="270deg" data-move-x="150%"> | ||
+ | |||
+ | </div></div> | ||
+ | </div> | ||
+ | |||
+ | <div style=";text-align: center; width: 100%;height: 0;z-index: 99;"> | ||
+ | <a href="#globalWrapper" style="margin-right:150px"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/1/16/ZJU_up.png" style="width:10%;height:40px;" /> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div style=";text-align: center; width: 100%;height: 0;z-index: 99;"> | ||
+ | <a href="#Quickview" style="margin-left:150px"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/0/09/ZJU_down.png" style="width:10%;height:40px;" /> | ||
+ | </a> | ||
+ | |||
+ | </div> | ||
+ | <br> | ||
+ | <br> | ||
+ | <br> | ||
+ | |||
+ | <div class="container" id="Quickview" style="padding-bottom:100px"> | ||
+ | |||
+ | |||
+ | <h2 class="hh2">Quickview</h2> | ||
+ | |||
+ | <div class="row"> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue1()" data-rotate-y="180deg" data-move-z="-200px" data-move-x="-300px" id="block1-1" > | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/0/08/ZJU-promotion.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue2()" data-rotate-x="180deg" data-rotate-y="180deg" data-move-z="-700px" id="block1-2"> | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/e/ee/ZJU-outreach.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue3()" data-rotate-x="180deg" data-rotate-y="45deg" data-move-z="-500px" id="block1-3"> | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/6/6f/ZJU-modling.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue4()" data-rotate-y="180deg" data-move-z="-100px" data-move-x="500px" id="block1-4"> | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/5/50/ZJU-application.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="row"> | ||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue5()" data-rotate-y="270deg" data-move-x="-150%" id="block2-1"> | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/0/04/ZJU-judge.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue6()" data-rotate-y="270deg" data-move-x="150%" id="block2-2"> | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/d/d7/ZJU-FUTURE.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue7()" data-rotate-y="270deg" data-move-x="-150%" id="block2-3"> | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/f/f3/ZJU-card.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="block" onclick="getValue8()" data-rotate-y="270deg" data-move-x="150%" id="block2-4"> | ||
+ | <img style="padding:20%" src="https://static.igem.org/mediawiki/2015/4/43/ZJU-safty.png"/> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div style=";text-align: center; width: 100%;height: 0;z-index: 99;"> | ||
+ | <a href="#intro" style="margin-right:150px"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/1/16/ZJU_up.png" style="width:10%;height:40px" /> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div style=";text-align: center; width: 100%;height: 0;z-index: 99;"> | ||
+ | <a href="#globalWrapper" style="margin-left:150px"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/0/09/ZJU_down.png" style="width:10%;height:40px" /> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | <script type="text/javascript" src="https://2015.igem.org/Team:ZJU-China/js/home/ZJU-jquery.smoove.min.js?action=raw&ctype=text/javascript"></script> | ||
+ | <script>$('.block').smoove({offset:'40%'});</script> | ||
+ | |||
+ | |||
+ | |||
+ | </body></html> | ||
</div> | </div> |
Revision as of 12:55, 8 September 2015
![](https://static.igem.org/mediawiki/2015/a/a7/ZJU-CHINA_AjaxLoader.gif)
INTRODUCTION
INTRODUCTION
Why we choose termites?
Termites are widely recognized as the 5th pest around the world, based on its astonishing number and incredible damage towards wood. Given that a termite weighed 1 gram, then everyone should own 500 thousand termites! Owing to their wood-eating habits, termites are terminators of crops, trees, buildings, river dams; and more often, spoil people’s life.
</div> </div>
</div>
<a href="#globalWrapper" style="margin-right:150px">
<img src="" style="width:10%;height:40px;" />
</a>
<a href="#Quickview" style="margin-left:150px">
<img src="" style="width:10%;height:40px;" />
</a>
Quickview
<img style="padding:20%" src=""/>
<img style="padding:20%" src=""/>
<img style="padding:20%" src=""/>
<img style="padding:20%" src=""/>
<img style="padding:20%" src=""/>
<img style="padding:20%" src=""/>
<img style="padding:20%" src=""/>
<img style="padding:20%" src=""/>
<a href="#intro" style="margin-right:150px">
<img src="" style="width:10%;height:40px" />
</a>
<a href="#globalWrapper" style="margin-left:150px">
<img src="" style="width:10%;height:40px" />
<script type="text/javascript" src="https://2015.igem.org/Team:ZJU-China/js/home/ZJU-jquery.smoove.min.js?action=raw&ctype=text/javascript"></script> <script>$('.block').smoove({offset:'40%'});</script>
</body></html>