|
|
(43 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
− | <html>
| + | {{Fudan-CHINA/initialize}} |
− |
| + | {{Fudan-CHINA/mainNav}} |
− | </p>
| + | |
− |
| + | |
− |
| + | |
− |
| + | |
− |
| + | |
− | <!--get jQuery------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | |
− | <script type="text/javascript" src="https://2018.igem.org/wiki/index.php?title=Template:Fudan-CHINA/jQuery&action=raw&ctype=text/javascript">
| + | |
− | //jQuery
| + | |
− | </script>
| + | |
− |
| + | |
− | <script type="text/javascript" src="https://2018.igem.org/wiki/index.php?title=Template:Fudan-CHINA/SuperSlide&action=raw&ctype=text/javascript">
| + | |
− | //jQuery_SuperSlide
| + | |
− | </script>
| + | |
− |
| + | |
− | <script type="text/javascript" src="https://2018.igem.org/wiki/index.php?title=Template:Fudan-CHINA/jQueryAnimateColors&action=raw&ctype=text/javascript">
| + | |
− | //jQuery_AnimateColors
| + | |
− | </script>
| + | |
− | <!---------------------------------------------------------------------------------------------------------------------------------------------------->
| + | |
− |
| + | |
− | | + | |
− |
| + | |
− | | + | |
− |
| + | |
− | <!--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>
| + | |
− | #home_logo, #sideMenu,#top { display:none; }
| + | |
− | #sideMenu, #top_title, .patrollink {display:none;}
| + | |
− | #content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;}
| + | |
− | body {background-color:white; }
| + | |
− | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
| + | |
− | #top_menu_under{display: none;}
| + | |
− | | + | |
− |
| + | |
− | #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>
| + | |
− | <!---------------------------------------------------------------------------------------------------------------------------------------------------->
| + | |
− |
| + | |
− |
| + | |
− |
| + | |
− |
| + | |
− | <!--get fonts----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | |
− | <style>
| + | |
− | @font-face
| + | |
− | {
| + | |
− | font-family:_Quicksand;/*for navigation bar*/
| + | |
− | src: url('https://static.igem.org/mediawiki/2018/8/8a/T--Fudan-CHINA--Quicksand.ttf');
| + | |
− | }
| + | |
− | @font-face
| + | |
− | {
| + | |
− | font-family:_wonderwall;
| + | |
− | src: url('https://static.igem.org/mediawiki/2018/4/43/T--Fudan-CHINA--wonderwall.ttf');
| + | |
− | }
| + | |
− | </style>
| + | |
− | <!---------------------------------------------------------------------------------------------------------------------------------------------------->
| + | |
− |
| + | |
− | | + | |
− | <!--navigation bar-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | |
− | <style>
| + | |
− | #navUl{
| + | |
− | list-style: none;
| + | |
− | margin: 0;
| + | |
− | padding: 0;
| + | |
− | overflow: hidden;
| + | |
− | display:inline-block;
| + | |
− | box-shadow: 0px 0px 5px;
| + | |
− | position:fixed;
| + | |
− | width: 1200px;
| + | |
− | background-color: white;
| + | |
− | }
| + | |
− | .navLi:not(.navImg){
| + | |
− | float: right;
| + | |
− | }
| + | |
− | .navA{
| + | |
− | display: block;
| + | |
− | height: 75px;
| + | |
− | padding:0 20px;
| + | |
− | color:rgba(108,119,132,1);
| + | |
− | font-family: _Quicksand;
| + | |
− | font-size: 30px;
| + | |
− |
| + | |
− | text-align: center;
| + | |
− | line-height: 75px;
| + | |
− | }
| + | |
− | .activeA{
| + | |
− | font-weight: 900;
| + | |
− | font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
| + | |
− | font-size: 35px;
| + | |
− | }
| + | |
− | .navA:link{text-decoration: none}
| + | |
− | | + | |
− | .navA:visited{
| + | |
− | color: rgba(108,119,132,1);
| + | |
− | }
| + | |
− |
| + | |
− | .navA:hover:not(.activeA){
| + | |
− | color: rgba(0,189,234,1);
| + | |
− | }
| + | |
− | .navA:hover{
| + | |
− | text-decoration:none;
| + | |
− | }
| + | |
− | | + | |
− | .navA:active{
| + | |
− | text-decoration:none;
| + | |
− | color: rgba(108,119,132,1);
| + | |
− | }
| + | |
− |
| + | |
− | </style>
| + | |
− |
| + | |
− |
| + | |
− |
| + | |
− | <ul id="navUl" style="z-index: 99;">
| + | |
− | <li class="navLi navImg" style="display: inline-block;float: left;width: 10px;" href="#8"></li>
| + | |
− | <li class="navLi navImg"><a href="#10"><img style="display: inline-block;width:70px;height: 70px;float: left;background-color: rgba(70,186,226,1);" src="https://static.igem.org/mediawiki/2018/7/79/T--Fudan-CHINA--stepHollow.png" /></a></li>
| + | |
− | <li class="navLi navImg"><a style="display: inline-block;float: left;width: 200px;font-family:Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif';color:rgba(70,186,226,1);" class="navA" href="#8">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>
| + | |
− | <li class="navLi"><a class="navA activeA" href="#1">HOME</a></li>
| + | |
− | </ul>
| + | |
− | <script>
| + | |
− | var winWidth=$(window).width();
| + | |
− | var navWidth=$('#navUl').width();
| + | |
− | var winHeight=$(window).height();
| + | |
− | $("#navUl").css("left",0.5*(winWidth-navWidth));
| + | |
− | $("#navUl").css("top",0.13*winHeight);
| + | |
− |
| + | |
− | $(window).resize(function(){
| + | |
− | var winWidth=$(window).width();
| + | |
− | var navWidth=$('#navUl').width();
| + | |
− | $("#navUl").css("left",0.5*(winWidth-navWidth));
| + | |
− | $("#navUl").css("top",0.13*winHeight);
| + | |
− | $(".bgPic").css("width",winWidth);
| + | |
− | });
| + | |
− | | + | |
− | $(window).scroll(function(){
| + | |
− | var topDis = $(window).scrollTop();
| + | |
− | if(topDis < 1)
| + | |
− | {$("#navUl").stop().animate({top:0.13*winHeight});}
| + | |
− | else
| + | |
− | {$("#navUl").stop().animate({top:'0px'});}
| + | |
− | });
| + | |
− | </script>
| + | |
− |
| + | |
− | | + | |
− | </html>
| + | |