Team:KULeuven/Tools/Navigation Bar

From 2008.igem.org

(Difference between revisions)
(New page: {|style="font color="#000000"; background-color:#ffffff; border-spacing:6px; text-align:center" width="960px" !style="text-align:center; background-color:#003E81; border-width:0px; padding...)
Line 1: Line 1:
 +
<!-- THE OLD NAVIGATION BAR -->
 +
<noinclude>
{|style="font color="#000000"; background-color:#ffffff; border-spacing:6px; text-align:center" width="960px"
{|style="font color="#000000"; background-color:#ffffff; border-spacing:6px; text-align:center" width="960px"
!style="text-align:center; background-color:#003E81; border-width:0px; padding:3px;"|[[Team:KULeuven|<font color="#ffffff">Home</font>]]
!style="text-align:center; background-color:#003E81; border-width:0px; padding:3px;"|[[Team:KULeuven|<font color="#ffffff">Home</font>]]
Line 8: Line 10:
!style="text-align:center; background-color:#003E81; border-width:0px; padding:3px;"|[[Team:KULeuven/Notebook|<font color="#ffffff">Notebook</font>]]
!style="text-align:center; background-color:#003E81; border-width:0px; padding:3px;"|[[Team:KULeuven/Notebook|<font color="#ffffff">Notebook</font>]]
|}
|}
 +
</noinclude>
 +
 +
<!-- HERE BEGINS THE ACTUAL NAVIGATION BAR -->
 +
<html>
 +
<!-- HEAD SECTION CONTAINING INLINE CSS AND JAVASCRIPT -->
 +
<head>
 +
 +
<!-- BEGIN OF CSS -->
 +
<style type="text/css">
 +
#sddm
 +
{ margin: 0;
 +
padding: 0;
 +
z-index: 30}
 +
 +
#sddm li
 +
{ margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
float: left;
 +
font: bold 13px arial}
 +
 +
#sddm li a
 +
{ display: block;
 +
margin: 0 2px 0 0;
 +
padding: 4px 20px;
 +
width: auto;
 +
background: #003E81;
 +
color: #FFF;
 +
text-align: center;
 +
text-decoration: none}
 +
 +
#sddm li a:hover
 +
{ background: #99CCFF}
 +
 +
#sddm div
 +
{ position: absolute;
 +
visibility: hidden;
 +
margin: 0;
 +
padding: 0;
 +
background: #EAEBD8;
 +
border: 1px solid #5970B2}
 +
 +
#sddm div a
 +
{ position: relative;
 +
display: block;
 +
margin: 0;
 +
padding: 5px 10px;
 +
width: auto;
 +
white-space: nowrap;
 +
text-align: left;
 +
text-decoration: none;
 +
background: #003E81;
 +
color: #FFF;
 +
font: 11px arial}
 +
 +
#sddm div a:hover
 +
{ background: #99CCFF;
 +
color: #FFF}
 +
</style>
 +
<!-- END OF CSS -->
 +
 +
<!-- BEGIN OF JAVASCRIPT -->
 +
<script type="text/javascript">
 +
 +
var timeout    = 500;
 +
var closetimer = 0;
 +
var ddmenuitem  = 0;
 +
 +
// open hidden layer
 +
function mopen(id)
 +
{
 +
// cancel close timer
 +
mcancelclosetime();
 +
 +
// close old layer
 +
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
 +
 +
// get new layer and show it
 +
ddmenuitem = document.getElementById(id);
 +
ddmenuitem.style.visibility = 'visible';
 +
 +
}
 +
// close showed layer
 +
function mclose()
 +
{
 +
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
 +
}
 +
 +
// go close timer
 +
function mclosetime()
 +
{
 +
closetimer = window.setTimeout(mclose, timeout);
 +
}
 +
 +
// cancel close timer
 +
function mcancelclosetime()
 +
{
 +
if(closetimer)
 +
{
 +
window.clearTimeout(closetimer);
 +
closetimer = null;
 +
}
 +
}
 +
 +
// close layer when click-out
 +
document.onclick = mclose;
 +
// -->
 +
</script>
 +
<!-- END OF JAVASCRIPT -->
 +
 +
</head>
 +
<!-- END OF HEAD SECTION -->
 +
 +
<!-- BEGIN OF BODY SECTION CONTAINING THE MENU BUILD UP -->
 +
<body>
 +
 +
<ul id="sddm">
 +
<!-- HOME SECTION -->
 +
<li><a href="https://2008.igem.org/Team:KULeuven"
 +
onmouseover="mopen('m1')" onmouseout="mclosetime()">Home</a>
 +
 +
</li>
 +
<!-- TEAM SECTION -->
 +
<li><a href="https://2008.igem.org/Team:KULeuven/Team"
 +
onmouseover="mopen('m2')" onmouseout="mclosetime()">The Team</a>
 +
 +
</li>
 +
<!-- ROAD MAP SECTION -->
 +
<li><a href="https://2008.igem.org/Team:KULeuven/Road_Map"
 +
onmouseover="mopen('m3')" onmouseout="mclosetime()">Road Map</a>
 +
 +
</li>
 +
<!-- PROJECT SECTION -->
 +
<li><a href="https://2008.igem.org/Team:KULeuven/Project"
 +
onmouseover="mopen('m4')" onmouseout="mclosetime()">The Project</a>
 +
<div id="m4" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
 +
<a href="https://2008.igem.org/Team:KULeuven/Brainstorm">Brainstorm</a>
 +
</div>
 +
</li>
 +
<!-- PARTS SECTION -->
 +
<li><a href="https://2008.igem.org/Team:KULeuven/Parts"
 +
onmouseover="mopen('m5')" onmouseout="mclosetime()">Parts Submitted to the Registry</a>
 +
 +
</li>
 +
<!-- MODEL SECTION -->
 +
<li><a href="https://2008.igem.org/Team:KULeuven/Modeling"
 +
onmouseover="mopen('m5')" onmouseout="mclosetime()">Modeling</a>
 +
 +
</li>
 +
<!-- NOTEBOOK SECTION -->
 +
<li><a href="https://2008.igem.org/Team:KULeuven/Notebook"
 +
onmouseover="mopen('m5')" onmouseout="mclosetime()">Notebook</a>
 +
 +
</li>
 +
</ul>
 +
 +
</body>
 +
<!-- END OF BODY SECTION -->
 +
</html>
 +
<!-- THAT'S ALL FOLKS! THE END -->

Revision as of 17:01, 7 July 2008


Home The Team Road Map The Project Parts Submitted to the Registry Modeling Notebook