|
|
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 class="header">
| + | <div id="header"> |
- | <div class="nav">
| + | <div class="bgimg"></div> |
| + | <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 373: |
Line 70: |
| <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> |
- | <script type="text/javascript"> | + | </div><!--content wrapper--> |
- | 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> |