Template:OUC-China.CommonCSS

From 2011.igem.org

(Difference between revisions)
Line 39: Line 39:
content: ".";  
content: ".";  
}
}
 +
</style>
 +
<style>
 +
#mainnav{
 +
                margin-top:125px;
 +
height: 230px;
 +
width: 840px;
 +
background:url(home.jpg) top center no-repeat;
 +
padding: 0;
 +
margin: 0;
 +
position: relative;
 +
}
 +
#mainnav a{
 +
text-decoration: none;
 +
}
 +
#mainnav a:hover{
 +
text-decoration: none;
 +
}
 +
#mainnav ul, .navmenus li{
 +
margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
}
 +
.navmenus{
 +
display: inline;
 +
width: 138px;
 +
float: left;
 +
background: white;
 +
border: 1px solid #DDDDDD;
 +
opacity: 0.9;
 +
}
 +
.navmenus li:hover {
 +
background: #EEEEEE;
 +
}
 +
#mainnav li{
 +
padding: 5px;
 +
border-bottom: 1px solid #DDDDDD;
 +
}
 +
#mainnavdrop{
 +
position: absolute;
 +
top: 28px;
 +
left: 0;
 +
z-index:1;
 +
}
 +
#mainnavbar {
 +
text-align: left;
 +
opacity: 0.8;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
#mainnavbar li{
 +
padding: 5px 0;
 +
display: block;
 +
position: absolute;
 +
width: 138px;
 +
text-align: center;
 +
background: white;
 +
top: 0;
 +
z-index: 2;
 +
}
 +
 +
#navitem1{
 +
left: 1px;
 +
}
 +
#navitem2{
 +
left: 141px;
 +
}
 +
#navitem2 a, #teamnav a{
 +
color: #c7b635;
 +
}
 +
#navitem3{
 +
left: 281px;
 +
}
 +
#navitem3 a, #projectnav a{
 +
color: #87430b;
 +
}
 +
#navitem4{
 +
left: 421px;
 +
}
 +
#navitem4 a, #resultnav a{
 +
color: green;
 +
}
 +
#navitem5{
 +
left: 561px;
 +
}
 +
#navitem5 a, #safetynav a{
 +
color:#5225a0;
 +
}
 +
#navitem6{
 +
left: 701px;
 +
}
 +
#navitem6 a, #othernav a{
 +
color: #2d7eed;
 +
}
</style>
</style>
<script type="text/javascript">
<script type="text/javascript">
 +
var addNav = function(){
 +
var strVar="";
 +
strVar += " <div id=\"mainnav\">";
 +
strVar += " <div id=\"mainnavbar\">";
 +
strVar += " <ul>";
 +
strVar += " <li id=\"navitem1\"><a class=\"navitem\" href=\"#homenav\">Home<\/a><\/li>";
 +
strVar += " <li id=\"navitem2\"><a class=\"navitem\" href=\"#teamnav\">Team<\/a><\/li>";
 +
strVar += " <li id=\"navitem3\"><a class=\"navitem\" href=\"#projectnav\">Project<\/a><\/li>";
 +
strVar += " <li id=\"navitem4\"><a class=\"navitem\" href=\"#resultnav\">Methods &amp; Results<\/a><\/li>";
 +
strVar += " <li id=\"navitem5\"><a class=\"navitem\" href=\"#safetynav\">Consideration<\/a><\/li>";
 +
strVar += " <li id=\"navitem6\"><a class=\"navitem\" href=\"#othernav\">Future Work<\/a><\/li>";
 +
strVar += " <\/ul>";
 +
strVar += " <\/div>";
 +
strVar += " <div id=\"mainnavdrop\">";
 +
strVar += " <ul id=\"homenav\" class=\"navmenus\" tag=\"Home.jpg\">";
 +
strVar += " <!--<li><a href=\"\/Team:OUC-China\">Home<\/a><\/li>-->";
 +
strVar += " <\/ul>";
 +
strVar += " <ul id=\"teamnav\" class=\"navmenus\" tag=\"team.jpg\">";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Team\/TeamIntro\">IGEMers introduction<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Team\/Instructors\">Instructor and Adviser<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Team\/Instructors#cop\">Collaborator<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Team\/Instructors#sup\">Support and thanks<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Team\/Instructors#mp\">Mutual help with other teams<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Team\/Photos\">Photo gallery<\/a><\/li>";
 +
strVar += " <\/ul>";
 +
strVar += " <ul id=\"projectnav\" class=\"navmenus\" tag=\"projects.jpg\">";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Project\/storm\">Brain storming<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Project\/Abstract\">Abstract<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Project\/Background\">Philosophical Background<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Project\/Mp\">Modern perspective<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Project\/PooSb\"> Performance on stage of Synthetic biology<\/a><\/li>";
 +
strVar += " <\/ul>";
 +
strVar += " <ul id=\"resultnav\" class=\"navmenus\" tag=\"result.jpg\">";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Materials\">Materials<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Puf2011d\">Part used from 2011 distribution<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Protocol\">Protocol<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Notebook\">Note book<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/aadb\">amino acid deficient bacteria<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/fv\">function verification<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/2011\">2011 Biobrick standardization and documentation<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Finalresults\">Final results<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Judging\">Judging form<\/a><\/li>";
 +
strVar += " <\/ul>";
 +
strVar += " <ul id=\"safetynav\" class=\"navmenus\" tag=\"Consideration.jpg\">";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Safety\/Consideration\">Human practice<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Safety\">Safety<\/a><\/li>";
 +
strVar += " <\/ul>";
 +
strVar += " <ul id=\"othernav\" class=\"navmenus\" tag=\"futurework.jpg\">";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Futurework\/Fa\">Foundational advance<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Futurework\/Newapp\">New application of synthetic biology<\/a><\/li>";
 +
strVar += " <\/ul>";
 +
strVar += " <\/div>";
 +
strVar += " <\/div>";
 +
return strVar;
 +
}
$("#menubar.right-menu ul li:first-child").before("<li><a href='https://2011.igem.org/Main_Page'>iGEM HQ</a></li>");
$("#menubar.right-menu ul li:first-child").before("<li><a href='https://2011.igem.org/Main_Page'>iGEM HQ</a></li>");
-
$("#content").before("<div id='gTop'><a href='/Team:OUC-China'></a></div>");
+
$("#content").before("<div id='gTop'><a href='/Team:OUC-China'></a>"+addNav()+"</div>");
$(document).ready(function(){$('a,input[type="submit"]').bind('focus',function(){if(this.blur){ this.blur();}});});
$(document).ready(function(){$('a,input[type="submit"]').bind('focus',function(){if(this.blur){ this.blur();}});});
 +
</script>
 +
<script>
 +
var hideSubNav = function(){
 +
$(".navmenus").stop(true,true).animate({opacity:0}, 200);
 +
$("#mainnav").css("background","url(Home.jpg) top center no-repeat");
 +
}
 +
 +
$(document).ready(function(){
 +
    $(".navmenus").stop(true,true).animate({opacity:0}, 200);
 +
$(".navitem").mouseenter(function(){
 +
$(".navmenus").stop(true,true).animate({opacity:0}, 200);
 +
console.log("done");
 +
$($(this).attr("href")).stop(true,true).animate({opacity:0.9}, 200);
 +
var bg = $($(this).attr("href")).attr("tag");
 +
$("#mainnav").animate({opacity:0.5}, 200,function(){
 +
$("#mainnav").css("background","url("+bg+") top center no-repeat");
 +
$("#mainnav").animate({opacity:1}, 200);
 +
});
 +
 +
});
 +
$(".navitem").click(function(){
 +
    return false;
 +
});
 +
$(".navmenus").mouseleave(function(){
 +
hideSubNav();
 +
});
 +
$(".mainnavbar").mouseleave(function(){
 +
hideSubNav();
 +
});
 +
});
</script>
</script>
</html>
</html>

Revision as of 03:10, 5 October 2011