Difference between revisions of "Template:Fudan-CHINA"

Line 1: Line 1:
 
<html>
 
<html>
+
<!--start---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
<!--start---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
+
 
</p>
 
</p>
 
 
Line 42: Line 41:
 
@font-face
 
@font-face
 
{
 
{
   font-family:_Quicksand;/*for loading*/
+
   font-family:_Quicksand;
 
  src: url('https://static.igem.org/mediawiki/2018/8/8a/T--Fudan-CHINA--Quicksand.ttf');
 
  src: url('https://static.igem.org/mediawiki/2018/8/8a/T--Fudan-CHINA--Quicksand.ttf');
 
}
 
}
Line 57: Line 56:
 
@font-face
 
@font-face
 
{
 
{
   font-family:_Algerian;/*for loading*/
+
   font-family:_Algerian;
 
  src: url('https://static.igem.org/mediawiki/2018/5/56/T--Fudan-CHINA--Algerian.ttf');
 
  src: url('https://static.igem.org/mediawiki/2018/5/56/T--Fudan-CHINA--Algerian.ttf');
 
}
 
}
 
@font-face
 
@font-face
 
{
 
{
   font-family:_ZELDA;
+
   font-family:_ZELDA;/*for team name*/
  src: url('https://static.igem.org/mediawiki/2018/d/df/T--Fudan-CHINA--ZELDA.ttf');
+
  src: url('https://static.igem.org/mediawiki/2018/d/df/T--Fudan-CHINA--ZELDA.ttf'),
 +
  url('https://static.igem.org/mediawiki/2018/6/63/T--Fudan-CHINA--ZELDA.eot');
 
}
 
}
 
@font-face
 
@font-face
 
{
 
{
 
   font-family:_Butler;
 
   font-family:_Butler;
  src: url('https://static.igem.org/mediawiki/2018/e/e1/T--Fudan-CHINA--Butler.ttf');
+
  src: url('https://static.igem.org/mediawiki/2018/e/e1/T--Fudan-CHINA--Butler.ttf'),
 +
  url('https://static.igem.org/mediawiki/2018/c/c9/T--Fudan-CHINA--Butler.eot');/*IE 9+*/
 
}
 
}
 
 
Line 307: Line 308:
 
 
 
<ul id="navUl" style="z-index: 999;">
 
<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="display: inline-block;float: left;width: 3%;" 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;"><a href="https://2018.igem.org/Team:Fudan-CHINA"><img class="navA teamImg" 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 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" style="display: inline-block;width: 3%;" href="#8"></li>
 
   <li class="navLi"><a class="navA" href="#7">Team</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="#6">Parts</a></li>
Line 316: Line 318:
 
<li class="navLi"><a class="navA" href="#3">Modeling</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" href="#2">Project</a></li>
 +
 
</ul>
 
</ul>
 
<style>
 
<style>
Line 324: Line 327:
 
overflow: hidden;
 
overflow: hidden;
 
position:fixed;
 
position:fixed;
width: 80%;
+
width: 100%;
background-color: aqua;
+
 
}
 
}
 
.navLi:not(.navImg){
 
.navLi:not(.navImg){
Line 332: Line 334:
 
.navA{
 
.navA{
 
display: block;
 
display: block;
height: 110px;
 
padding:0 20px;
 
color:white;
 
 
font-family:Butler,_Butler;
 
font-family:Butler,_Butler;
 
font-weight: 400;
 
font-weight: 400;
font-size: 30px;
 
 
text-align: center;
 
text-align: center;
line-height: 110px;
+
 
 +
}
 +
.navA:not(.teamName){
 +
color:white;
 
}
 
}
 
.teamName{
 
.teamName{
 
font-family:Zelda,_Zelda;
 
font-family:Zelda,_Zelda;
 
font-weight: 400;
 
font-weight: 400;
font-size: 35px;
 
 
}
 
}
 
.navA:link{
 
.navA:link{
Line 358: Line 358:
 
}
 
}
 
.jqhover {
 
.jqhover {
         color:black !important;
+
         color:rgba(0,201,161,1) !important;
 
     }
 
     }
 
.navA:hover{
 
.navA:hover{
Line 376: Line 376:
 
var navWidth=$('#navUl').width();
 
var navWidth=$('#navUl').width();
 
var winHeight=$(window).height();
 
var winHeight=$(window).height();
$("#navUl").css("left",0.5*(winWidth-navWidth));
 
 
$("#navUl").css("top",0.1*winHeight);
 
$("#navUl").css("top",0.1*winHeight);
 +
if (winWidth/winHeight>2){
 +
$("#navUl").css("height","8vh");
 +
$(".navA").css("height","8vh");
 +
$(".navA").css("line-height","8vh");
 +
$(".navA").css("font-size","3vh");
 +
$(".navA:not(img)").css("padding","0 3vh");
 +
$(".teamImg").css("width","5vh");
 +
$(".teamImg").css("height","5vh");
 +
$(".teamImg").css("padding","1.5vh 0");
 +
 +
}
 +
else{
 +
$("#navUl").css("height","4vw");
 +
$(".navA").css("height","4vw");
 +
$(".navA").css("line-height","4vw");
 +
$(".navA").css("font-size","1.5vw");
 +
$(".navA:not(img)").css("padding","0 1.5vw");
 +
$(".teamImg").css("width","2.5vw");
 +
$(".teamImg").css("height","2.5vw");
 +
$(".teamImg").css("padding","0.75vw 0");
 +
 +
}
 +
 
};
 
};
 
navFun();
 
navFun();
Line 388: Line 410:
 
var winHeight=$(window).height();
 
var winHeight=$(window).height();
 
         var topDis = $(window).scrollTop();
 
         var topDis = $(window).scrollTop();
if(topDis >150){
+
var barHeight=$("#top_menu_14").height();
$("#navUl").stop().animate({top:'11px',backgroundColor:"rgba(32,22,99,1.00)",boxShadow:"0px 0px 5px"},"fast");
+
if(topDis >0.2*winHeight){
 +
$("#navUl").stop().animate({top:barHeight,backgroundColor:"rgba(25,25,25,1.00)",boxShadow:"0px 0px 5px"},"fast");
 
    $(".navA:not(.activeA)").hover(function () {
 
    $(".navA:not(.activeA)").hover(function () {
 
                 $(this).addClass("jqhover");
 
                 $(this).addClass("jqhover");
Line 401: Line 424:
 
                 $(this).removeClass("jqhover");
 
                 $(this).removeClass("jqhover");
 
             });
 
             });
 +
 
};
 
};
 
     });
 
     });

Revision as of 13:45, 24 September 2018