|
|
Line 142: |
Line 142: |
| margin-bottom:-30px; | | margin-bottom:-30px; |
| padding-top:0px; | | padding-top:0px; |
− | padding-botton:0px
| + | padding-bottom:0px; |
− | }
| + | position:absolute; |
− | @media screen and (max-width: 900px) {
| + | top:0px; |
− | .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>
| + | |
− | <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) { | | @media screen and (max-width: 900px) { |