Line 1: | Line 1: | ||
{{Fudan-CHINA}} | {{Fudan-CHINA}} | ||
<html> | <html> | ||
+ | |||
+ | |||
+ | |||
+ | <!--make the menu hidden-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | ||
+ | <script> | ||
+ | $(document).ready(function(){ | ||
+ | $('#sideMenu').remove(); | ||
+ | let trigger = document.createElement('div'); | ||
+ | $(trigger).attr('id','menu-trigger'); | ||
+ | let menu = document.getElementById('top_menu_14'); | ||
+ | $(trigger).mouseenter(function(){ | ||
+ | $(menu).css('top','0'); | ||
+ | }); | ||
+ | $(trigger).mouseleave(function(){ | ||
+ | $(menu).css('top','-20px'); | ||
+ | }); | ||
+ | document.body.appendChild(trigger); | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | |||
+ | |||
+ | <style> | ||
+ | |||
+ | #top_menu_14{ | ||
+ | top: -20px; padding-bottom: 2px; transition: top 0.3s; | ||
+ | } | ||
+ | #top_menu_14:hover { | ||
+ | top: 0 !important; | ||
+ | } | ||
+ | #menu-trigger{ | ||
+ | width:100%; | ||
+ | height:16px; | ||
+ | position:fixed; | ||
+ | left:0; | ||
+ | top:0; | ||
+ | z-index:10; | ||
+ | } | ||
+ | #HQ_page ul.navigation-bar > li > ul.sub-menu > li{ | ||
+ | min-width: 100px; | ||
+ | } | ||
+ | #HQ_page ul.navigation-bar > li > ul > li.long{ | ||
+ | min-width: 160px; | ||
+ | } | ||
+ | </style> | ||
+ | <!----------------------------------------------------------------------------------------------------------------------------------------------------> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!--navigation bar--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | ||
+ | <style> | ||
+ | #navUl{ | ||
+ | list-style: none; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | overflow: hidden; | ||
+ | position:fixed; | ||
+ | width: 1500px; | ||
+ | } | ||
+ | .navLi:not(.navImg){ | ||
+ | float: right; | ||
+ | } | ||
+ | .navA{ | ||
+ | display: block; | ||
+ | height: 110px; | ||
+ | padding:0 20px; | ||
+ | color:white; | ||
+ | font-family:_Butler; | ||
+ | font-weight: 400; | ||
+ | font-size: 30px; | ||
+ | text-align: center; | ||
+ | line-height: 110px; | ||
+ | } | ||
+ | .teamName{ | ||
+ | font-family:_Zelda; | ||
+ | font-weight: 400; | ||
+ | font-size: 35px; | ||
+ | } | ||
+ | .navA:link{ | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .navA:visited{ | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .navA:hover:not(.activeA){ | ||
+ | color: rgba(0,189,234,1); | ||
+ | } | ||
+ | .jqhover { | ||
+ | color:black !important; | ||
+ | } | ||
+ | .navA:hover{ | ||
+ | text-decoration:none; | ||
+ | } | ||
+ | |||
+ | .navA:active{ | ||
+ | text-decoration:none; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | <ul id="navUl" style="z-index: 999;"> | ||
+ | <li class="navLi navImg" style="display: inline-block;float: left;width: 10px;" href="#8"></li> | ||
+ | <li class="navLi navImg" style="float: left;"><a href="https://2018.igem.org/Team:Fudan-CHINA"><img class="navA" style="width=80px;height:80px;padding:15px; " src="https://static.igem.org/mediawiki/2018/6/6b/T--Fudan-CHINA--teamBadgeWhite_noCircle.png" /></a></li> | ||
+ | <li class="navLi navImg" style="float: left;position: relative;"><a class="navA activeA teamName" href="https://2018.igem.org/Team:Fudan-CHINA">Fudan-CHINA</a></li> | ||
+ | <li class="navLi"><a class="navA" href="#7">Team</a></li> | ||
+ | <li class="navLi"><a class="navA" href="#6">Parts</a></li> | ||
+ | <li class="navLi"><a class="navA" href="#5">Practices</a></li> | ||
+ | <li class="navLi"><a class="navA" href="#4">Lab</a></li> | ||
+ | <li class="navLi"><a class="navA" href="#3">Modeling</a></li> | ||
+ | <li class="navLi"><a class="navA" href="#2">Project</a></li> | ||
+ | </ul> | ||
+ | <script> | ||
+ | function navFun(){ | ||
+ | var winWidth=$(window).width(); | ||
+ | var navWidth=$('#navUl').width(); | ||
+ | var winHeight=$(window).height(); | ||
+ | $("#navUl").css("left",0.5*(winWidth-navWidth)); | ||
+ | $("#navUl").css("top",0.1*winHeight); | ||
+ | }; | ||
+ | window.onload=navFun(); | ||
+ | |||
+ | $(window).resize(function(){ | ||
+ | navFun(); | ||
+ | }); | ||
+ | |||
+ | $(window).scroll(function(){ | ||
+ | var winHeight=$(window).height(); | ||
+ | var topDis = $(window).scrollTop(); | ||
+ | if(topDis >150){ | ||
+ | $("#navUl").stop().animate({top:'0px',backgroundColor:"rgba(4,198,215,1)",boxShadow:"0px 0px 5px"},"fast"); | ||
+ | $(".navA:not(.activeA)").hover(function () { | ||
+ | $(this).addClass("jqhover"); | ||
+ | }).mouseout(function () { | ||
+ | $(this).removeClass("jqhover"); | ||
+ | }); | ||
+ | } | ||
+ | else{ | ||
+ | $("#navUl").stop().animate({top:0.1*winHeight,backgroundColor:"transparent"},"fast"); | ||
+ | $(".navA:not(.activeA)").hover(function () { | ||
+ | $(this).removeClass("jqhover"); | ||
+ | }); | ||
+ | }; | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!----------------------------------------------------------------------------------------------------------------------------------------------------> | ||
+ | |||
+ | |||
+ | |||
<!--page--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | <!--page--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | ||
<img class="bgPic" src="https://static.igem.org/mediawiki/2018/8/8f/T--Fudan-CHINA--bgpicture2.jpeg" style="z-index: -1;-webkit-filter: brightness(0.85); | <img class="bgPic" src="https://static.igem.org/mediawiki/2018/8/8f/T--Fudan-CHINA--bgpicture2.jpeg" style="z-index: -1;-webkit-filter: brightness(0.85); | ||
− | filter: brightness(0.85);" /> | + | filter: brightness(0.85);width=100%" /> |
<video id="bgVideo" autoplay muted loop style="width: 100%;position: absolute;top:0;left: 0;"> | <video id="bgVideo" autoplay muted loop style="width: 100%;position: absolute;top:0;left: 0;"> | ||
Line 12: | Line 173: | ||
<script> | <script> | ||
− | + | /* function bgPicFun(){ | |
var winWidth=$(window).width(); | var winWidth=$(window).width(); | ||
$(".bgPic").css("width",winWidth); | $(".bgPic").css("width",winWidth); | ||
Line 19: | Line 180: | ||
$(window).resize(function(){ | $(window).resize(function(){ | ||
bgPicFun(); | bgPicFun(); | ||
− | }); | + | });*/ |
</script> | </script> | ||
Line 75: | Line 236: | ||
<!--end---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | <!--end---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | ||
− | + | ||
</html> | </html> |
Revision as of 17:03, 21 September 2018
Synthetic Transducer Engineering Platform