Template:Zjuheader

From 2011.igem.org

(Difference between revisions)
(Undo revision 221795 by Dananger (talk))
Line 1: Line 1:
-
{{ZJUglobal}}
 
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns="http://www.w3.org/1999/xhtml">
 +
<head>
 +
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 +
<link href='http://fonts.googleapis.com/css?family=Molengo' rel='stylesheet' type='text/css'>
 +
<link href='http://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
 +
<title>ZJUHeader</title>
 +
<style>
 +
#contentwrapper{
 +
vertical-align:middle;
 +
width:970px;margin:0 auto;text-align:left;position:relative;
 +
font-family:'Molengo', sans-serif;
 +
background-color:#e9e9e9;
 +
}
 +
 +
.header{
 +
background-color:transparent;
 +
background-image:url(https://static.igem.org/mediawiki/2011/2/28/Zjuheader-end.jpg);
 +
width:970px;
 +
height:300px;
 +
position:static ;
 +
top:1px;
 +
}
 +
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
 +
div#top-section{
 +
background-color:#F3F3F3;
 +
height: 1px;
 +
    width:  970px;
 +
border: 0;
 +
z-index: 10;
 +
}
 +
div#p-logo{
 +
    display: none;
 +
}
 +
div#menubar{
 +
/*text-align:center;*/
 +
top: 0;
 +
height:20px;
 +
width:300px;
 +
    font-family: 'Molengo', sans-serif;
 +
font-size:8pt;
 +
}
 +
div#menubar .selected a{
 +
    color: #529dd9;
 +
}
 +
 +
 +
.left-menu, .left-menu a {
 +
    color:#529dd9;
 +
z-index: 1;
 +
}
 +
.left-menu:hover {
 +
background-color: #666666;
 +
}
 +
 +
.right-menu{
 +
    top: 0;
 +
z-index: 1;
 +
 +
}
 +
 +
.right-menu li {
 +
#    background-color: transparent;
 +
}
 +
.right-menu li a {
 +
    padding: 0px 15px 0px 0px;
 +
    color: #529dd9;
 +
    background-color: white;
 +
}
 +
.right-menu li a:hover {
 +
    color: #529dd9;
 +
}
 +
div#search-controls{
 +
    display: none;
 +
    position: absolute;
 +
    float: right;
 +
}
 +
#mw-searchButton{
 +
    display: none;
 +
    border: none;
 +
}
 +
 +
 +
 +
 +
#content {
 +
z-index: 1;
 +
background-color: #e9e9e9;;
 +
border: none;
 +
width: 970px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
padding:0px;
 +
font-family:'Molengo', sans-serif;
 +
}
 +
#content p{
 +
display:none;
 +
}
 +
#contentwrapper{
 +
vertical-align:middle;
 +
width:970px;margin:0 auto;text-align:left;position:relative;
 +
font-family:'Molengo', sans-serif;
 +
}
 +
#contentwrapper p{
 +
display:block;
 +
}
 +
 +
.firstHeading {
 +
display:none;}
 +
 +
 +
#contentSub {
 +
display:none;
 +
}
 +
 +
#catlinks {
 +
display:none;
 +
}
 +
 +
#footer-box{
 +
display: none;
 +
}
 +
 +
#contentSub {
 +
display:none;
 +
}
 +
 +
#catlinks {
 +
display:none;
 +
}
 +
 +
#footer-box{
 +
display: none;
 +
}
 +
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
 +
ul#topnav {
 +
margin: 0; padding: 0;
 +
padding-top:230px;
 +
left:10px;
 +
float: left;
 +
width: 960px;
 +
list-style: none;
 +
position: relative; /*--Set relative positioning on the unordered list itself - not on the list item--*/
 +
 +
background:transparent;
 +
/*background: url(topnav_stretch.gif) repeat-x;*/
 +
 +
}
 +
#search {
 +
margin:0; padding: 0;
 +
background-color:black;
 +
filter:alpha(opacity=40);
 +
-moz-opacity:0.4;
 +
-khtml-opacity:0.4;
 +
opacity:0.4;
 +
height:39px;
 +
width:245px;
 +
}
 +
#searchbar{
 +
margin-top:5px;
 +
margin-left:5px;
 +
}
 +
#contentwrapper .header .nav #topnav  a {
 +
font-family: 'Hammersmith One', sans-serif;;
 +
}
 +
 +
 +
ul#topnav li {
 +
float: left;
 +
/*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
 +
margin: 0; padding: 0;
 +
 +
border-right: 1px solid #555; /*--Divider for each parent level links--*/
 +
 +
}
 +
ul#topnav li a {
 +
padding: 10px 15px;
 +
 +
font-size: 28px;
 +
display: block;
 +
color: #f0f0f0;
 +
text-decoration: none;
 +
}
 +
 +
ul#topnav li a:hover {
 +
filter:alpha(opacity=100);
 +
-moz-opacity:1.0;
 +
-khtml-opacity:1.0;
 +
opacity:1.0;
 +
}
 +
 +
/*--Notice the hover color is on the list item itself, not on the link. This is so it can stay highlighted even when hovering over the subnav--*/
 +
 +
.nav #topnav #P_Pr{
 +
background-color: #f19226;
 +
filter:alpha(opacity=60);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
}
 +
.nav #topnav #P_Te{
 +
background-color: #56b74c;
 +
filter:alpha(opacity=60);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
}
 +
.nav #topnav #P_No{
 +
background-color: #0068b1;
 +
filter:alpha(opacity=60);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
}
 +
.nav #topnav #P_Hu {
 +
background-color: #4700b1;
 +
filter:alpha(opacity=60);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
}
 +
ul#topnav li span {
 +
float:left;
 +
padding: 3px;
 +
 +
position: absolute;
 +
/*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
 +
width:945px;
 +
left: 0;
 +
/*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
 +
top:268px;
 +
display: none; /*--Hide by default--*/
 +
 +
background:transparent;
 +
color: #fff;
 +
/*--Bottom right rounded corner--*/
 +
-moz-border-radius-bottomright: 5px;
 +
-khtml-border-radius-bottomright: 5px;
 +
-webkit-border-bottom-right-radius: 5px;
 +
/*--Bottom left rounded corner--*/
 +
-moz-border-radius-bottomleft: 5px;
 +
-khtml-border-radius-bottomleft: 5px;
 +
-webkit-border-bottom-left-radius: 5px;
 +
 +
}
 +
#not{
 +
margin-left:210px;}
 +
#pro{
 +
margin-left:1px;}
 +
#tea{
 +
margin-left:170px;}
 +
#hum{
 +
margin-left:250px;}
 +
ul#topnav span a{
 +
font-size:22px;
 +
padding: 10px 5px;
 +
}
 +
 +
ul#topnav li span a {
 +
                      display: inline; } /*--Since we declared a link style on the parent list link, we will correct it back to its original state--*/
 +
 +
ul#topnav li span a:hover {text-decoration: underline;}
 +
.nav #P_Home {
 +
background-color: #ed4334;
 +
 +
 +
}
 +
 +
.nav  #P_Project {
 +
background-color: #f19226;
 +
filter:alpha(opacity=60);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
/*set the alpha*/
 +
cursor: pointer;
 +
}
 +
.nav  #P_Team {
 +
background-color: #56b74c;
 +
filter:alpha(opacity=60);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
/*set the alpha*/
 +
cursor: pointer;
 +
}
 +
 +
.nav  #P_Notebook {
 +
background-color: #0068b1;
 +
filter:alpha(opacity=50);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
/*set the alpha*/
 +
cursor: pointer;
 +
}
 +
.nav  #P_HumanPractice {
 +
background-color: #4700b1;
 +
filter:alpha(opacity=50);
 +
-moz-opacity:0.6;
 +
-khtml-opacity: 0.6;
 +
opacity: 0.6;
 +
/*set the alpha*/
 +
cursor: pointer;
 +
}
 +
 +
a:hover{
 +
text-decoration:none;
 +
 +
}
 +
</style>
 +
 +
</head>
 +
<body>
<body>
<div id="contentwrapper">
<div id="contentwrapper">
-
<div id="header">
+
  <div class="header">
-
<div class="bgimg"></div>
+
  <div class="nav">
-
<div class="bgpart1"></div>
+
-
<div class="bgpart2"></div>
+
-
    <div class="banner">
+
-
                    <div class="logo"><img src="https://static.igem.org/mediawiki/2011/c/c9/Logo.png" width="200" height="200" /></div>
+
-
                    <div class="title"><img src="http://ung.igem.org/wiki/images/b/b3/Title.png" width="603" height="220" /></div>
+
-
                    <div class="igemlogo"><a  target="_blank" href="https://2011.igem.org"><img src="https://static.igem.org/mediawiki/2011/e/e2/Igemlogo.png" width="180" height="150" /></a></div>
+
-
</div><!--banner-->
+
-
    <div class="nav">
+
                   <ul id="topnav">
                   <ul id="topnav">
   <li ><a id="P_Home" href="https://2011.igem.org/Team:ZJU-China">Home</a></li>
   <li ><a id="P_Home" href="https://2011.igem.org/Team:ZJU-China">Home</a></li>
Line 70: Line 373:
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=en"></script></div></div></li>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=en"></script></div></div></li>
</ul>
</ul>
-
</div><!--navbar-->
 
</div>
</div>
-
</div><!--content wrapper-->
+
<script type="text/javascript">
 +
  document.getElementById('P_Team').onclick=function(){
 +
  document.getElementById('P_Te').style.display='block'
 +
 
 +
    document.getElementById('P_Pr').style.display='none'
 +
document.getElementById('P_No').style.display='none'
 +
document.getElementById('P_Hu').style.display='none'
 +
<!-- document.getElementById('P_Pr').style.display='none' -->
 +
  };
 +
    document.getElementById('P_Project').onclick=function(){
 +
  document.getElementById('P_Pr').style.display='block'
 +
    document.getElementById('P_Te').style.display='none'
 +
document.getElementById('P_No').style.display='none'
 +
document.getElementById('P_Hu').style.display='none'
 +
<!-- document.getElementById('P_Pr').style.display='none' -->
 +
  };
 +
    document.getElementById('P_Notebook').onclick=function(){
 +
  document.getElementById('P_No').style.display='block'
 +
    document.getElementById('P_Pr').style.display='none'
 +
document.getElementById('P_Te').style.display='none'
 +
document.getElementById('P_Hu').style.display='none'
 +
<!-- document.getElementById('P_Pr').style.display='none' -->
 +
  };
 +
    document.getElementById('P_HumanPractice').onclick=function(){
 +
  document.getElementById('P_Hu').style.display='block'
 +
    document.getElementById('P_Pr').style.display='none'
 +
document.getElementById('P_No').style.display='none'
 +
document.getElementById('P_Te').style.display='none'
 +
<!-- document.getElementById('P_Pr').style.display='none' -->
 +
  };
 +
 
 +
</script>
 +
 
 +
 
 +
</div></div>
 +
 
</body>
</body>
</html>
</html>

Revision as of 05:45, 5 October 2011

ZJUHeader

Retrieved from "http://2011.igem.org/Template:Zjuheader"