Team:UGent/Templates/Header

From 2013.igem.org

(Difference between revisions)
Line 22: Line 22:
<style>
<style>
#contentSub, #search-controls, .firstHeading, #catlinks, #p-logo{display:none;}
#contentSub, #search-controls, .firstHeading, #catlinks, #p-logo{display:none;}
-
#feed_views{display:none;}
 
#top-section{border: none;height: 0px}
#top-section{border: none;height: 0px}
#content{border: none; width:1200px;}
#content{border: none; width:1200px;}
-
body{background-color:#ffffff;overflow-y: scroll}
+
 
 +
body{background-color:#ffffff}
ul{list-style-image:url('https://static.igem.org/mediawiki/2013/5/50/UGent_2013_TandwielWIKI.png');font-family:"Verdana";font-size:13px;padding-right:50px;
ul{list-style-image:url('https://static.igem.org/mediawiki/2013/5/50/UGent_2013_TandwielWIKI.png');font-family:"Verdana";font-size:13px;padding-right:50px;
padding-left:50px;}
padding-left:50px;}
Line 50: Line 50:
<!-- ####### Drop down ####### -->
<!-- ####### Drop down ####### -->
<html>
<html>
-
<style>
+
<head>
-
#navigation {
+
<script type="text/javascript">
-
    padding: 0px;
+
// Copyright 2006-2007 javascript-array.com
-
    position: relative;
+
-
    color:rgb(0,33,67);
+
-
    height:30px;
+
-
}
+
-
#navigation, #navigation ul {
+
var timeout = 50;
-
    list-style-type:none;
+
var closetimer = 0;
-
    list-style-image: none;
+
var ddmenuitem = 0;
-
    margin:0;
+
-
}
+
-
#navigation ul li {
+
// open hidden layer
-
    background: transparent;
+
function mopen(id)
-
    color:rgb(0,33,67);
+
{
-
    width:158px;
+
// cancel close timer
-
    float:left;
+
mcancelclosetime();
-
    position: relative;
+
-
    margin:0;
+
-
}
+
-
#navigation ul li:hover {
+
// close old layer
-
    background:rgb(0,33,67);
+
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
-
    color:white;
+
-
    width:158px;
+
-
    float:left;
+
-
    position: relative;
+
-
    margin:0;
+
-
}
+
-
#navigation ul li a {
+
// get new layer and show it
-
    text-align: center;
+
ddmenuitem = document.getElementById(id);
-
    padding:5px;
+
ddmenuitem.style.visibility = 'visible';
-
    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
-
#navigation ul li ul {
+
function mclose()
-
    display:none;
+
{
-
}
+
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
-
#navigation ul li:hover ul {
+
-
    display: block;
+
-
    position: absolute;
+
}
}
-
#navigation ul li ul li {
+
// go close timer
-
    text-align:left;
+
function mclosetime()
-
    z-index:999;
+
{
 +
closetimer = window.setTimeout(mclose, timeout);
}
}
-
#navigation ul li:hover ul li a {
+
// cancel close timer
-
    background:#fff;
+
function mcancelclosetime()
-
    color:rgb(0,33,67);
+
{
 +
if(closetimer)
 +
{
 +
window.clearTimeout(closetimer);
 +
closetimer = null;
 +
}
}
}
-
#navigation ul li:hover ul li a:hover {
+
// close layer when click-out
-
    background:rgb(0,33,67);
+
document.onclick = mclose;
-
    color:white;
+
</script>
-
}
+
</head>
-
</style>
+
<style>
-
</html>
+
#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>
 +
</html>

Revision as of 13:05, 11 September 2013

UGent 2013 Banner.jpg
UGent 2013 Banner.jpg