Difference between revisions of "Team:Fudan-CHINA"

Line 2: Line 2:
 
<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>
 
 
 
 
 
 
 
<!---------------------------------------------------------------------------------------------------------------------------------------------------->
 
 
 
  
 
 
Line 173: Line 14:
 
 
 
<script>
 
<script>
/* function bgPicFun(){
+
function bgPicFun(){
 
var winWidth=$(window).width();
 
var winWidth=$(window).width();
 
$(".bgPic").css("width",winWidth);
 
$(".bgPic").css("width",winWidth);
Line 180: Line 21:
 
$(window).resize(function(){
 
$(window).resize(function(){
 
bgPicFun();
 
bgPicFun();
});*/
+
});
 
</script>
 
</script>
 
 
Line 211: Line 52:
 
<script>
 
<script>
 
function pjNameFun(){
 
function pjNameFun(){
 +
var winWidth=$(window).width();
 +
var winHeight=$(window).height();
 +
var stepWidth=$('#step').width();
 +
var stepHeight=$('#step').height();
 +
var fnWidth=$('#fullName').width();
 +
var fnHeight=$('#fullName').height();
 +
var fnTop=1.2*stepHeight;
 +
var totalTop=fnTop+fnHeight;
 +
$("#step").css("left",0.5*(winWidth-stepWidth));
 +
$("#step").css("top",0.5*(winHeight-totalTop));
 +
var stepY = $('#step').offset().top;
 +
$("#fullName").css("left",0.5*(winWidth-fnWidth));
 +
$("#fullName").css("top",stepY+fnTop);
 +
};
 +
/*function pjNameFun(){
 
var winWidth=$(window).width();
 
var winWidth=$(window).width();
 
var winHeight=$(window).height();
 
var winHeight=$(window).height();
Line 221: Line 77:
 
$("#fullName").css("left",0.5*(winWidth-fnWidth));
 
$("#fullName").css("left",0.5*(winWidth-fnWidth));
 
$("#fullName").css("top",stepY+1.2*stepHeight);
 
$("#fullName").css("top",stepY+1.2*stepHeight);
};
+
};*/
window.onload=setTimeout(function(){pjNameFun();},500);
+
window.onload=pjNameFun();
 
$(window).resize(function(){
 
$(window).resize(function(){
 
pjNameFun();
 
pjNameFun();
 
});
 
});
 
 
 
 
</script>
 
</script>

Revision as of 07:49, 22 September 2018

Synthetic Transducer Engineering Platform