Team:Wageningen UR/Templates/HeaderFooterStyle

From 2011.igem.org

(Difference between revisions)
 
(14 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
 +
<head>
 +
<style>
 +
#smoothmenu1 ul {
 +
list-style: none;
 +
}
-
<head>
+
#smoothmenu2 ul {
 +
list-style: none;
 +
}
-
 
+
.ddsmoothmenu{
-
<STYLE TYPE="text/css">
+
font: bold 12px 'Quattrocento', arial, sans;
-
<!--
+
background: #244F62; /*background of menu bar (default state)*/
 +
margin:0px 5px 0px 5px;
 +
}
-
.menuh {
+
.ddsmoothmenu ul{
-
BORDER-COLOR : #FFFF99 ;
+
z-index:100;  
-
cursor : hand ;
+
margin: 0;
-
Border-Left : #FFFF99 ;
+
padding: 0;
-
Border-Top : #FFFF99 ;
+
list-style-type: none;
-
Padding-Left : 1px ;
+
}
-
Padding-Top : 1px ;
+
-
Background-Color : #FFFF99 ;
+
-
}
+
-
.menu {
+
-
Background-Color : white ;
+
-
}
+
-
.home {
+
-
cursor : hand ;
+
-
}
+
-
.menulinks{
+
/*Top level list items*/
-
text-decoration:none;
+
.ddsmoothmenu ul li{
 +
position: relative;
 +
display: inline;
 +
float: left;
}
}
-
//-->
 
-
</STYLE>
 
 +
/*Top level menu link items style*/
 +
.ddsmoothmenu ul li a{
 +
display: block;
 +
background: #244F62; /*background of menu items (default state)*/
 +
padding: 8px 10px;
 +
color: white;
 +
border-right: 1px solid #298BB6;
 +
color: #2d2b2b;
 +
text-decoration: none;
 +
padding-left: 20px;
 +
}
 +
* html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
 +
display: inline-block;
 +
}
-
  </head>
+
.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{
 +
color: white;
 +
}
 +
.ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
 +
background: #096790;
 +
color: white;
 +
}
 +
.ddsmoothmenu ul li a:hover{
 +
background: #096790;
 +
}
 +
 +
/*1st sub level menu*/
 +
.ddsmoothmenu ul li ul{
 +
position: absolute;
 +
left: 0;
 +
display: none; /*collapse all sub menus to begin with*/
 +
visibility: hidden;
 +
}
-
  <body>
+
/*Sub level menu list items (undo style from Top level List Items)*/
-
<SCRIPT Language="Javascript1.2">
+
.ddsmoothmenu ul li ul li{
-
<!--
+
display: list-item;
 +
float: none;
 +
}
-
/*
+
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
-
Static menu script (By maXimus, maximus@nsimail.com, http://maximus.ravecore.com/)
+
.ddsmoothmenu ul li ul li ul{
-
Modified slightly/ permission granted to Dynamic Drive to feature script in archive
+
top: 0;
-
For full source, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
+
}
-
*/
+
-
//configure below variable for menu width, position on page
+
/* Sub level menu links style */
-
var menuwidth=110
+
.ddsmoothmenu ul li ul li a{
-
var offsetleft=10
+
font: normal 13px 'Quattrocento', arial, sans;
-
var offsettop=90
+
width: 160px; /*width of sub menus*/
-
 
+
height: 20px;
-
var ns4=document.layers?1:0
+
margin: 0;
-
var ie4=document.all?1:0
+
padding-left: 37px;
-
var ns6=document.getElementById&&!document.all?1:0
+
padding-top: 10px;
 +
}
-
function makeStatic() {
+
.ddsmoothmenu ul li ul li a:hover{
-
if (ie4) {object1.style.pixelTop=document.body.scrollTop+offsettop}
+
background: #096790 url('https://static.igem.org/mediawiki/2011/4/43/3menubar.png') center left no-repeat;
-
else if (ns6) {document.getElementById("object1").style.top=window.pageYOffset+offsettop}
+
-
else if (ns4) {eval(document.object1.top=eval(window.pageYOffset+offsettop));}
+
-
setTimeout("makeStatic()",0);
+
}
}
-
if (ie4||ns6) {document.write('<span ALIGN="CENTER" ID="object1" STYLE="Position:absolute; Top:20; Left:'+offsetleft+'; Z-Index:5;cursor:hand;background-color:black;"><TABLE BORDER="1" width="'+menuwidth+'" CELLPADDING="0" CELLSPACING="0" BORDERCOLOR="black" bgcolor="white">')}
+
</style>
-
else if (ns4){ document.write('<LAYER top="20" name="object1" left="'+offsetleft+'" BGCOLOR=black><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="1"><TR><TD><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" width="'+menuwidth+'">')}
+
-
if (ie4||ns6||ns4)
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-
document.write('<TR><TD BGCOLOR="#3399FF" BORDERCOLORDARK="#99CCFF" BORDERCOLORLIGHT="#003399"><P ALIGN=CENTER><FONT SIZE="4" FACE=ARIAL>Menu</FONT></TD></TR>')
+
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 +
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
-
var menui = new Array();
+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
-
var menul = new Array();
+
<script type="text/javascript" src="http://www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.js">
-
//configure below for menu items. Extend list as desired
+
/***********************************************
 +
* Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
 +
* This notice MUST stay intact for legal use
 +
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
 +
***********************************************/
-
menui[0]="Dynamic Drive";
+
</script>
-
menui[1]="What\'s New?";
+
-
menui[2]="What\'s Hot?";
+
-
menui[3]="Message Forum";
+
-
menui[4]="FAQs";
+
-
menui[5]="Submit Script";
+
-
menui[6]="Link to us";
+
-
menui[7]="Email us";
+
-
menul[0]="http://dynamicdrive.com";
+
<script type="text/javascript">
-
menul[1]="http://dynamicdrive.com/new.htm";
+
-
menul[2]="http://dynamicdrive.com/hot.htm";
+
-
menul[3]="http://wsabstract.com/cgi-bin/Ultimate.cgi";
+
-
menul[4]="http://dynamicdrive.com/faqs.htm";
+
-
menul[5]="http://dynamicdrive.com/submit.htm";
+
-
menul[6]="http://dynamicdrive.com/link.htm";
+
-
menul[7]="http://dynamicdrive.com/contact.htm";
+
-
for (i=0;i<=menui.length-1;i++)
+
ddsmoothmenu.init({
-
if (ie4||ns6) {document.write('<TR><TD BORDERCOLOR="white" ONCLICK="location=\''+menul[i]+'\'" onmouseover="className=\'menuh\'" onMouseout="className=\'menu\'"><CENTER><FONT>'+menui[i]+'</FONT></TD></TR>')}
+
mainmenuid: "smoothmenu1", //menu DIV id
-
else if (ns4){document.write('<TR><TD BGCOLOR="white"><ILAYER><LAYER width="'+menuwidth+'" onmouseover="bgColor=\'yellow\'" onmouseout="bgColor=\'white\'"><CENTER><A HREF="'+menul[i]+'" class=menulinks>'+menui[i]+'</A></CENTER></LAYER></ILAYER></TD></TR>')}
+
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
 +
classname: 'ddsmoothmenu', //class added to menu's outer DIV
 +
//customtheme: ["#1c5a80", "#18374a"],
 +
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
 +
})
-
if (ie4||ns6) {document.write('</TABLE></span>')}
 
-
else if (ns4){document.write('</TABLE></TD></TR></TABLE></LAYER>')}
 
-
function menu3(){
+
</script>
-
if (ns6||ie4||ns4)
+
</head>
-
makeStatic()
+
<body>
-
}
+
-
window.onload=menu3
+
<div id="smoothmenu1" class="ddsmoothmenu">
 +
<ul>
 +
<li><a href="#">Project Description</a>
 +
<ul>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/IntroductionProj1">Abstract</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/CompleteProject1Description" style="padding-top: 5px !important; height: 28px;">Complete Project Description</a></li>
 +
</ul>
 +
</li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/Devices" style="padding-right: 20px !important;">Devices</a></li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/ModelingProj1" style="padding-right: 20px !important;">Modeling</a></li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/NotebookProj1">Notebook</a>
 +
  <ul>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/February" target="_self">February</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/March" target="_self">March</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/April" target="_self">April</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/May" target="_self">May</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/June" target="_self">June</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/July" target="_self">July</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/August" target="_self">August</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/September" target="_self">September</a></li>
 +
  </ul>
 +
</li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/PartsProj1" style="padding-right: 20px !important;">Parts submitted to the registry</a></li>
 +
</ul>
 +
<br style="clear: left" />
 +
</div>
-
//-->
 
-
</SCRIPT>
 
-
 
 
-
  </body>
 
-
  </html>
+
</body>
 +
</html>

Latest revision as of 22:22, 28 July 2011