Template:OUC-China.CommonCSS

From 2011.igem.org

(Difference between revisions)
 
(53 intermediate revisions not shown)
Line 11: Line 11:
#gTop {
#gTop {
width: 860px;
width: 860px;
-
height: 233px;
+
height: 360px;
margin: 0 auto 0 auto;
margin: 0 auto 0 auto;
border:none;
border:none;
Line 18: Line 18:
body {
body {
     background:#161616;
     background:#161616;
-
     color:white;
+
     color:#333333;
 +
    font-size:11px;
}
}
#footer-box { background:black;} #footer-box a {color: white;}
#footer-box { background:black;} #footer-box a {color: white;}
-
#content {background:none; color:#dddddd; width:860px; }
+
#content {background:none; color:#333333; width:830px; }
-
h1,h2,h3,h4,h5,h6 {color:white; padding:8px; line-height:150%;}
+
h1,h2,h3,h4,h5,h6 {color:black; padding:8px; line-height:150%;}
 +
h3 { border:1px solid grey;  border-left:3px solid grey;}
#content p { padding:10px; }
#content p { padding:10px; }
.selflink {color:white;}
.selflink {color:white;}
#catlinks {display:none;}
#catlinks {display:none;}
h1 {margin:0; padding:15px;}
h1 {margin:0; padding:15px;}
-
#contentleft {width:250px; float:left;}
 
-
#contentright {width:700px; float:left;}
 
#toc {display:none;}
#toc {display:none;}
-
#logoimg { margin-top:25px; }
+
 
 +
.floatimg { float:left; margin:10px;}
 +
.clear:after{
 +
display:block;
 +
visibility:hidden;
 +
clear:both;
 +
height:0;
 +
content: ".";
 +
}
 +
</style>
 +
<style>
 +
#mainnav{
 +
                top:125px;
 +
                left:10px;
 +
height: 230px;
 +
width: 840px;
 +
background:url(https://static.igem.org/mediawiki/2011/3/3b/OUC-China.daohang.jpg.jpg) 0 0 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.01;
 +
                filter: alpha(opacity=1);
 +
}
 +
.navmenus li:hover {
 +
background: #EEEEEE;
 +
}
 +
#mainnav li{
 +
padding: 5px;
 +
border-bottom: 1px solid #DDDDDD;
 +
}
 +
#mainnavdrop{
 +
position: absolute;
 +
top: 28px;
 +
left: 0;
 +
z-index:1111;
 +
                overflow: hidden;
 +
}
 +
#mainnavbar {
 +
text-align: left;
 +
opacity: 0.9;
 +
                filter: alpha(opacity=90);
 +
margin: 0;
 +
padding: 0;
 +
}
 +
#mainnavbar li{
 +
padding: 5px 0;
 +
display: block;
 +
position: absolute;
 +
width: 138px;
 +
text-align: center;
 +
background: white;
 +
top: 0;
 +
z-index: 2222;
 +
}
 +
 
 +
#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=\"0\">";
 +
strVar += " <!--<li><a href=\"\/Team:OUC-China\">Home<\/a><\/li>-->";
 +
strVar += " <\/ul>";
 +
strVar += " <ul id=\"teamnav\" class=\"navmenus\" tag=\"840\">";
 +
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=\"1680\">";
 +
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\/db\">Performance on stage of Synthetic biology<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Project\/prezi\">Prezi<\/a><\/li>";
 +
strVar += " <\/ul>";
 +
strVar += " <ul id=\"resultnav\" class=\"navmenus\" tag=\"2520\">";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Materials\">Materials<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Puf2011d\">Previous biobricks we used<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Protocol\">Protocol<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/Notebook\">Notebook & Data<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/aadb\">Experiments on HB101<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/fv\">Experiments on devices<\/a><\/li>";
 +
strVar += " <li><a href=\"\/Team:OUC-China\/Result\/2011\">2011 OUC Wuxingbricks 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=\"3360\">";
 +
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=\"4200\">";
 +
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'><img id='logoimg' src='https://static.igem.org/mediawiki/2011/2/24/OUC-China.logo.jpg'/></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();}});});
 +
</script>
 +
<script>
 +
(function($) {
 +
$.extend($.fx.step,{
 +
    backgroundPosition: function(fx) {
 +
            if (fx.state === 0){ if(typeof fx.end == 'string') {
 +
                var start = $.curCSS(fx.elem,'backgroundPosition');
 +
                start = toArray(start);
 +
                fx.start = [start[0],start[2]];
 +
                var end = toArray(fx.end);
 +
                fx.end = [end[0],end[2]];
 +
                fx.unit = [end[1],end[3]];
 +
      }
 +
          }
 +
            var nowPosX = [];
 +
            nowPosX[0] = ((fx.end[0] - fx.start[0]) * fx.pos) + fx.start[0] + fx.unit[0];
 +
            nowPosX[1] = ((fx.end[1] - fx.start[1]) * fx.pos) + fx.start[1] + fx.unit[1];
 +
            fx.elem.style.backgroundPosition = nowPosX[0]+' '+nowPosX[1];
 +
 
 +
          function toArray(strg){
 +
              strg = strg.replace(/left|top/g,'0px');
 +
              strg = strg.replace(/right|bottom/g,'100%');
 +
              strg = strg.replace(/([0-9\.]+)(\s|\)|$)/g,"$1px$2");
 +
              var res = strg.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
 +
              return [parseFloat(res[1],10),res[2],parseFloat(res[3],10),res[4]];
 +
          }
 +
        }
 +
});
 +
})(jQuery);
 +
var hideSubNav = function(){
 +
$(".navmenus").stop(true,true).animate({opacity:0}, 200);
 +
        $(".navmenus").css("height",10);
 +
if((window.location+"").match("Team:OUC-China/Team")){
 +
$("#mainnav").css("background","url(https://static.igem.org/mediawiki/2011/3/3b/OUC-China.daohang.jpg.jpg) -840px 0 no-repeat");
 +
      }else if((window.location+"").match("Team:OUC-China/Project")){
 +
$("#mainnav").css("background","url(https://static.igem.org/mediawiki/2011/3/3b/OUC-China.daohang.jpg.jpg) -1680px 0 no-repeat");
 +
      }else if((window.location+"").match("Team:OUC-China/Result")){
 +
$("#mainnav").css("background","url(https://static.igem.org/mediawiki/2011/3/3b/OUC-China.daohang.jpg.jpg)  -2520px 0 no-repeat");
 +
      }else if((window.location+"").match("Team:OUC-China/Safety")){
 +
$("#mainnav").css("background","url(https://static.igem.org/mediawiki/2011/3/3b/OUC-China.daohang.jpg.jpg)  -3360px 0 no-repeat");
 +
      }else if((window.location+"").match("Team:OUC-China/Futurework")){
 +
$("#mainnav").css("background","url(https://static.igem.org/mediawiki/2011/3/3b/OUC-China.daohang.jpg.jpg) -4200px 0 no-repeat");
 +
      }
 +
}
 +
 
 +
$(document).ready(function(){
 +
    hideSubNav();
 +
$(".navitem").mouseenter(function(){
 +
$(".navmenus").stop(true,true).animate({opacity:0}, 200);
 +
                $(".navmenus").css("height","auto");
 +
$($(this).attr("href")).stop(true,true).animate({opacity:0.9}, 200);
 +
var bg = $($(this).attr("href")).attr("tag");
 +
$("#mainnav").stop().animate({backgroundPosition:"(-"+bg+"px 0px)"}, {duration:200,easing:'swing'});
 +
});
 +
$(".navitem").click(function(){
 +
            if($(this).attr("href")=="#homenav"){
 +
                window.location="https://2011.igem.org/Team:OUC-China";
 +
            }
 +
    return false;
 +
});
 +
$(".navmenus").mouseleave(function(){
 +
hideSubNav();
 +
});
 +
$(".mainnav").mouseleave(function(){
 +
hideSubNav();
 +
});
 +
});
</script>
</script>
</html>
</html>

Latest revision as of 15:41, 5 October 2011

Retrieved from "http://2011.igem.org/Template:OUC-China.CommonCSS"