Line 1: | Line 1: | ||
+ | <html> | ||
+ | <style type="text/css"> | ||
+ | body { | ||
+ | background-color: #fffae6; | ||
+ | color: #022634; | ||
+ | width:100%; | ||
+ | padding-bottom:150px; | ||
+ | } | ||
+ | #sideMenu, #top_title { | ||
+ | display: none; | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family: 'test'; | ||
+ | src: url(https://static.igem.org/mediawiki/2016/f/fd/Montserrat-Regular.otf); | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family: 'fsb'; | ||
+ | src: url('https://static.igem.org/mediawiki/2016/3/3f/Fsb.otf'); | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family: 'gga'; | ||
+ | src: url('https://static.igem.org/mediawiki/2016/9/94/Gga.otf') format('truetype'); | ||
+ | } | ||
+ | @font-face{ | ||
+ | font-family: 'spr'; | ||
+ | src: url('https://static.igem.org/mediawiki/2016/b/b7/SansPro-Regular.otf'); | ||
+ | } | ||
+ | .color2 { | ||
+ | font-family: Verdana, Geneva, sans-serif; | ||
+ | color: #660000; | ||
+ | font-weight:700; | ||
+ | font-size:40px; | ||
+ | } | ||
+ | .templates{ | ||
+ | font-size: 20px; | ||
+ | font-family:Verdana, Geneva, sans-serif; | ||
+ | color:#000501; | ||
+ | padding-left:100px; | ||
+ | padding-right:100px; | ||
+ | } | ||
+ | #top.bounce{ | ||
+ | -moz-animation-duration: 3s; | ||
+ | -moz-animation-delay: 2s; | ||
+ | -moz-animation-iteration-count: infinite; | ||
+ | -webkit-animation-duration: 3s; | ||
+ | -webkit-animation-delay: 2s; | ||
+ | -webkit-animation-iteration-count: infinite; | ||
+ | } | ||
+ | #top { | ||
+ | position: fixed; | ||
+ | width: 150px; | ||
+ | height: 20px; | ||
+ | z-index: 1034; | ||
+ | font-size: 15px; | ||
+ | font-weight:200; | ||
+ | bottom:120px; | ||
+ | right:0px; | ||
+ | font-family: Verdana, Geneva, sans-serif; | ||
+ | } | ||
+ | #top1 { | ||
+ | position: fixed; | ||
+ | width: 100px; | ||
+ | height: 100px; | ||
+ | z-index: 1033; | ||
+ | bottom:0px; | ||
+ | right:50px; | ||
+ | } | ||
+ | #top2 { | ||
+ | position: fixed; | ||
+ | width: 100px; | ||
+ | height: 100px; | ||
+ | z-index: 1033; | ||
+ | bottom:150px; | ||
+ | right:50px; | ||
+ | } | ||
+ | #bar{ | ||
+ | background-color: #031924; | ||
+ | text-decoration: blink; | ||
+ | font-family: test; | ||
+ | transition: opacity 1s ease; | ||
+ | z-index:100; | ||
+ | height:90px; | ||
+ | line-height:100px; | ||
+ | |||
+ | } | ||
+ | .scrolled{ | ||
+ | opacity:0.5; | ||
+ | line-height:100px; | ||
+ | |||
+ | } | ||
+ | |||
+ | .xwcms { | ||
+ | width: 100px; | ||
+ | height: 100px; | ||
+ | margin: 0 auto; | ||
+ | -webkit-background-size: 100px 100px; | ||
+ | -moz-background-size: 100px 100px; | ||
+ | background-size: 100px 100px; | ||
+ | background: no-repeat url("https://static.igem.org/mediawiki/2016/d/d2/Backtotop.png") left top; | ||
+ | -webkit-border-radius: 50px; | ||
+ | border-radius: 50px; | ||
+ | -webkit-transition: -webkit-transform 0.5s ease-out; | ||
+ | -moz-transition: -moz-transform 0.5s ease-out; | ||
+ | -o-transition: -o-transform 0.5s ease-out; | ||
+ | -ms-transition: -ms-transform 0.5s ease-out; | ||
+ | } | ||
+ | .xwcms:hover { | ||
+ | -webkit-transform: rotateZ(360deg); | ||
+ | -moz-transform: rotateZ(360deg); | ||
+ | -o-transform: rotateZ(360deg); | ||
+ | -ms-transform: rotateZ(360deg); | ||
+ | transform: rotateZ(360deg); | ||
+ | } | ||
+ | #bar:hover{ | ||
+ | height:120px; | ||
+ | transition: all 1s ease; | ||
+ | opacity: 1; | ||
+ | font-size:20px; | ||
+ | } | ||
+ | #image{ | ||
+ | border-radius: 50%; | ||
+ | margin:0 auto; | ||
+ | width:100px; | ||
+ | height:100px; | ||
+ | border:none; | ||
+ | overflow:hidden; | ||
+ | } | ||
+ | .color3{ | ||
+ | background-color:#031924; | ||
+ | color:white; | ||
+ | font-size:14px; | ||
+ | position:absolute; | ||
+ | width:100%; | ||
+ | } | ||
+ | .color3 address{ | ||
+ | margin-left:20px; | ||
+ | margin-top:20px; | ||
+ | margin-bottom:20px; | ||
+ | } | ||
+ | .B{ display:none; | ||
+ | margin-top:-10px; | ||
+ | margin-bottom:-30px; | ||
+ | padding-top:0px; | ||
+ | padding-botton:0px | ||
+ | } | ||
+ | @media screen and (max-width: 900px) { | ||
+ | .xwcms {display:none;} | ||
+ | .A {display:none;} | ||
+ | .B {display:inline;} | ||
+ | } | ||
+ | @media screen and (max-width: 900px) { | ||
+ | #top1 {display:none;} | ||
+ | } | ||
+ | #lalala{ | ||
+ | font-family:inherit; | ||
+ | padding-top:0px; | ||
+ | } | ||
+ | #lalala1{ | ||
+ | font-family:inherit; | ||
+ | padding-top:6px; | ||
+ | } | ||
+ | .dropdown ul{ | ||
+ | margin: 0px; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | <script type="text/javascript"> | ||
+ | |||
+ | $(window).scroll(function(){ | ||
+ | |||
+ | var scroll = $(window).scrollTop(); | ||
+ | |||
+ | if (scroll > 0 ) { | ||
+ | |||
+ | if ($('nav').is(':hover') === false) { | ||
+ | $('nav').addClass('scrolled'); | ||
+ | $('nav a').css('padding', '5px 13px 0 13px'); | ||
+ | $('nav a').css('height', '29px'); | ||
+ | $('nav a#lalala').css('padding-top','0px'); | ||
+ | $('nav a#lalala1').css('padding-top','6px'); | ||
+ | |||
+ | } | ||
+ | |||
+ | $( "nav" ).mouseenter(function() { | ||
+ | $('nav').removeClass('scrolled'); | ||
+ | $('nav a').css('height', '40px'); | ||
+ | $('nav a').css('padding', '10px 13px 0 13px'); | ||
+ | $('nav a#lalala').css('padding-top','10px'); | ||
+ | $('nav a#lalala1').css('padding-top','18px'); | ||
+ | |||
+ | }); | ||
+ | |||
+ | $( "nav" ).mouseleave(function() { | ||
+ | $('nav').addClass('scrolled'); | ||
+ | $('nav a').css('padding', '5px 13px 0 13px'); | ||
+ | $('nav a').css('height', '29px'); | ||
+ | $('nav a#lalala').css('padding-top','0px'); | ||
+ | $('nav a#lalala1').css('padding-top','6px'); | ||
+ | |||
+ | }); | ||
+ | |||
+ | $( "nav" ).mouseover(function() { | ||
+ | $('nav').removeClass('scrolled'); | ||
+ | $('nav a').css('height', '40px'); | ||
+ | $('nav a').css('padding', '10px 13px 0 13px'); | ||
+ | $('nav a#lalala').css('padding-top','10px'); | ||
+ | $('nav a#lalala1').css('padding-top','18px'); | ||
+ | |||
+ | |||
+ | }); | ||
+ | |||
+ | } | ||
+ | |||
+ | if (scroll <= 0 ) { | ||
+ | $('nav').removeClass('scrolled'); | ||
+ | $('nav a').css('padding', '10px 13px 0 13px'); | ||
+ | $('nav a').css('height', '40px'); | ||
+ | $('nav a#lalala').css('padding-top','0px'); | ||
+ | $('nav a#lalala1').css('padding-top','6px'); | ||
+ | |||
+ | $( "nav" ).mouseenter(function() { | ||
+ | $('nav').removeClass('scrolled'); | ||
+ | $('nav a').css('height', '40px'); | ||
+ | $('nav a').css('padding', '10px 13px 0 13px'); | ||
+ | $('nav a#lalala').css('padding-top','10px'); | ||
+ | $('nav a#lalala1').css('padding-top','18px'); | ||
+ | }); | ||
+ | |||
+ | $( "nav" ).mouseleave(function() { | ||
+ | $('nav').removeClass('scrolled'); | ||
+ | $('nav a').css('padding', '10px 13px 0 13px'); | ||
+ | $('nav a').css('height', '40px'); | ||
+ | $('nav a#lalala').css('padding-top','0px'); | ||
+ | $('nav a#lalala1').css('padding-top','6px'); | ||
+ | }); | ||
+ | |||
+ | $( "nav" ).mouseover(function() { | ||
+ | $('nav').removeClass('scrolled'); | ||
+ | $('nav a').css('height', '40px'); | ||
+ | $('nav a').css('padding', '10px 13px 0 13px'); | ||
+ | $('nav a#lalala').css('padding-top','10px'); | ||
+ | $('nav a#lalala1').css('padding-top','18px'); | ||
+ | }); | ||
+ | |||
+ | } | ||
+ | |||
+ | }); | ||
+ | |||
+ | </script> | ||
+ | |||
+ | <head> | ||
+ | <meta charset="utf-8"> | ||
+ | <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
+ | <link rel="stylesheet" href="https://2016.igem.org/Team:ZJU-China/css/Bootstrap?action=raw&ctype=text/css" type="text/css" /> | ||
+ | <link rel="stylesheet" href="https://2016.igem.org/Team:ZJU-China/css/animate?action=raw&ctype=text/css" type="text/css" /> | ||
+ | <link rel="stylesheet" href="https://2016.igem.org/Team:ZJU-China/css/reset?action=raw&ctype=text/css" type="text/css" /> | ||
+ | <link rel="stylesheet" href="https://2016.igem.org/Team:ZJU-China/css/fa?action=raw&ctype=text/css" type="text/css" /> | ||
+ | <script src="https://2016.igem.org/Team:ZJU-China/js/Bootstrap?action=raw&ctype=text/javascript"></script> | ||
+ | <script src="https://2016.igem.org/Team:ZJU-China/js/Bootstrap_jQuery?action=raw&ctype=text/javascript"></script> | ||
+ | |||
+ | |||
+ | <!-- Bootstrap --> | ||
+ | </head> | ||
+ | <div class="A"> | ||
+ | <nav class="navbar navbar-default navbar-fixed-top" id="bar"> | ||
+ | <div class="container" style="padding-top:36px;"> | ||
+ | <!-- Brand and toggle get grouped for better mobile display --> | ||
+ | |||
+ | |||
+ | <!-- Collect the nav links, forms, and other content for toggling --> | ||
+ | <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> | ||
+ | |||
+ | <ul class="nav navbar-nav"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China" id="lalala">Home</a></li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Project<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Description">Description</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Design">Design</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Experiments">Experiments</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Proof">Proof of concept</a></li> | ||
+ | <li role="separator" class="divider"></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Results">Result</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Notebook">Notebook</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Demonstrate">Demonstrate</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Parts<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Parts">Parts</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Composite_Part">Composite Parts</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Part_Collection">Part collection</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Modeling<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model">Overview</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model/first">Light Control</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model/second">Infiltration</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model/third">Oscillation</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Hardware" id="lalala">Hardware</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Safety" id="lalala">Safety</a></li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Human Practice<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Human_Practices">HP summary</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/HP/Silver">Silver</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/HP/Gold">Gold</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Engagement">Engagement</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Team<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Team">Team</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Collaborations">Collaborations</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Attribution">Attributions</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div><!-- /.navbar-collapse --> | ||
+ | </div><!-- /.container-fluid --> | ||
+ | </nav> | ||
+ | </div> | ||
+ | <div class="B"> | ||
+ | |||
+ | <nav class="navbar navbar-default" role="navigation" style="background-color:#031924; font-weight:bold;"> | ||
+ | <div class="container-fluid"> | ||
+ | <div class="navbar-header"> | ||
+ | <button type="button" class="navbar-toggle" data-toggle="collapse" | ||
+ | data-target="#example-navbar-collapse"> | ||
+ | <span class="sr-only"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | </button> | ||
+ | <a class="navbar-brand" href="https://2016.igem.org/Team:ZJU-China">ZJU-China</a> | ||
+ | </div> | ||
+ | <div class="collapse navbar-collapse" id="example-navbar-collapse"> | ||
+ | <ul class="nav navbar-nav"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China" id="lalala">Home</a></li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Project<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Description">Description</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Design">Design</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Experiments">Experiments</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Proof">Proof of concept</a></li> | ||
+ | <li role="separator" class="divider"></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Results">Result</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Notebook">Notebook</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Demonstrate">Demonstrate</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Parts<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Parts">Parts</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Composite_Part">Composite Parts</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Part_Collection">Part collection</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Modeling<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model">Overview</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model/first">Light Control</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model/second">Infiltration</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Model/third">Oscillation</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Hardware" id="lalala">Hardware</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Safety" id="lalala">Safety</a></li> | ||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Human Practice<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Human_Practices">HP summary</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/HP/Silver">Silver</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/HP/Gold">Gold</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Engagement">Engagement</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" id="lalala">Team<span class="caret"></span></a> | ||
+ | <ul class="dropdown-menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Team">Team</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Collaborations">Collaborations</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:ZJU-China/Attribution">Attributions</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | </nav> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div id="top" class="animated infinite bounce slow"><a href="#"><strong>Back to top</strong></a></div> | ||
+ | <div id="top2" class="animated infinite bounce slow"><p><i class="icon-chevon-up-3x"></i></p></div> | ||
+ | <div id="top1" class="xwcms"><a href="#"><img src="https://static.igem.org/mediawiki/2016/d/d2/Backtotop.png" id="image"></a></div> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | </html> | ||
<html> | <html> | ||
<style type="text/css"> | <style type="text/css"> |
Revision as of 06:48, 19 October 2016