Team:UGent/Templates/Header

From 2013.igem.org

(Difference between revisions)
Line 50: Line 50:
<!-- ####### Drop down ####### -->
<!-- ####### Drop down ####### -->
<html>
<html>
-
<head>
+
<style>
-
<script type="text/javascript">
+
#navigation {
-
// Copyright 2006-2007 javascript-array.com
+
    padding: 0px;
 +
    position: relative;
 +
    color:rgb(0,33,67);
 +
    height:30px;
 +
}
-
var timeout = 50;
+
#navigation, #navigation ul {
-
var closetimer = 0;
+
    list-style-type:none;
-
var ddmenuitem = 0;
+
    list-style-image: none;
 +
    margin:0;
 +
}
-
// open hidden layer
+
#navigation ul li {
-
function mopen(id)
+
    background: transparent;
-
{
+
    color:rgb(0,33,67);
-
// cancel close timer
+
    width:158px;
-
mcancelclosetime();
+
    float:left;
 +
    position: relative;
 +
    margin:0;
 +
}
-
// close old layer
+
#navigation ul li:hover {
-
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
+
    background:rgb(0,33,67);
 +
    color:white;
 +
    width:158px;
 +
    float:left;
 +
    position: relative;
 +
    margin:0;
 +
}
-
// get new layer and show it
+
#navigation ul li a {
-
ddmenuitem = document.getElementById(id);
+
    text-align: center;
-
ddmenuitem.style.visibility = 'visible';
+
    padding:5px;
 +
    display:block;
 +
    text-decoration:none;
 +
    color:rgb(0,33,67);
 +
}
 +
#navigation ul li:hover a {
 +
    text-align: center;
 +
    padding:5px;
 +
    display:block;
 +
    text-decoration:none;
 +
    color:white;
}
}
-
// close showed layer
+
 
-
function mclose()
+
#navigation ul li ul {
-
{
+
    display:none;
-
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
+
}
 +
#navigation ul li:hover ul {
 +
    display: block;
 +
    position: absolute;
}
}
-
// go close timer
+
#navigation ul li ul li {
-
function mclosetime()
+
    text-align:left;
-
{
+
    z-index:999;
-
closetimer = window.setTimeout(mclose, timeout);
+
}
}
-
// cancel close timer
+
#navigation ul li:hover ul li a {
-
function mcancelclosetime()
+
    background:#fff;
-
{
+
    color:rgb(0,33,67);
-
if(closetimer)
+
-
{
+
-
window.clearTimeout(closetimer);
+
-
closetimer = null;
+
-
}
+
}
}
-
// close layer when click-out
+
#navigation ul li:hover ul li a:hover {
-
document.onclick = mclose;
+
    background:rgb(0,33,67);
-
</script>
+
    color:white;
-
</head>
+
}
-
<style>
+
-
#sddm
+
-
{ margin: 0;
+
-
padding: 0;
+
-
z-index: 30}
+
-
 
+
-
#sddm li
+
-
{ margin: 0;
+
-
padding: 0;
+
-
list-style: none;
+
-
float: left;
+
-
font: bold 11px Verdana}
+
-
 
+
-
#sddm li a
+
-
{ display: block;
+
-
margin: 0 1px 0 0;
+
-
padding: 10px 10px;
+
-
height: 15px;
+
-
background: #F9BD05;
+
-
color: #18204b;
+
-
text-align: center;
+
-
        vertical-align:middle;
+
-
text-decoration: none}
+
-
 
+
-
#sddm li a:hover
+
-
{ background: #18204b;
+
-
        color:#F9BD05 }
+
-
 
+
-
#sddm div
+
-
{ position: absolute;
+
-
visibility: hidden;
+
-
margin: 0;
+
-
padding: 0;
+
-
background: #EAEBD8;
+
-
border: 1px solid #18204b}
+
-
 
+
-
#sddm div a
+
-
{ position: relative;
+
-
display: block;
+
-
margin: 0;
+
-
padding: 5px 10px;
+
-
width: auto;
+
-
white-space: nowrap;
+
-
text-align: left;
+
-
text-decoration: none;
+
-
background: #EAEBD8;
+
-
color: #18204b;
+
-
font: 11px Verdana}
+
-
 
+
-
#sddm div a:hover
+
-
{ background: #49A3FF;
+
-
color: #FFF}
+
</style>
</style>
</html>
</html>

Revision as of 13:03, 11 September 2013

UGent 2013 Banner.jpg
UGent 2013 Banner.jpg



Retrieved from "http://2013.igem.org/Team:UGent/Templates/Header"