Team:TU-Delft/Test

From 2012.igem.org

(Difference between revisions)
Line 5: Line 5:
<style type="text/css">
<style type="text/css">
-
#navLaksh {
+
#nav { /*main menu css*/
-
position:fixed;
+
position:fixed;
width:850px;
width:850px;
top:15px;
top:15px;
Line 19: Line 19:
/*letter-spacing:1px;*/
/*letter-spacing:1px;*/
text-transform:uppercase;
text-transform:uppercase;
 +
}
 +
#nav ul{
 +
width: 620px;
 +
background: white;
 +
text-align:center;
 +
margin: 0 auto;
 +
}
 +
#nav li.on ul, #nav li.off ul {
 +
margin: 0;
 +
padding: 0;
 +
}
 +
#nav a {
 +
text-decoration: none;
 +
}
 +
#nav li { /*float the main list items*/
 +
    position:static;
 +
margin: 0;
 +
float: left;
 +
display: inline;
 +
padding:0 3px;
 +
background:white ;
 +
text-align:center;
 +
width:90px;
 +
 +
}
 +
#nav li ul {
 +
display: none;
 +
width:200px;
 +
}
 +
#nav li.off ul, #nav li.on ul { /*Position of the submenu!!*/
 +
position:static;
 +
direction:ltr;
 +
 +
width:150px;
 +
height:100px;
 +
 +
/*left:30px;
 +
right:50%;*/
 +
margin: 0 0 0 -150px;
 +
padding: 0 0 0 0;
 +
background:white;
 +
text-align:center;
}
}
-
    #navLaksh li { float: left; }
+
#nav li a {
-
        #navLaksh li:hover { position: relative }
+
color: #000000;   /*the main menu letters color but home*/
-
        #navLaksh li:hover > a {  
+
font-weight: bold;
-
            background: #021A1A;  
+
display: block;
-
           
+
height: 30px;
-
            box-shadow: 5px 5px 25px #000;
+
width: auto;
-
            -moz-box-shadow: 5px 5px 25px #000;
+
border-bottom:0;
-
            -webkit-box-shadow: 5px 5px 25px #000;
+
margin: 2px;
-
   
+
padding: 0 0 2px 0;  
-
            border-radius: 10px;
+
}
-
            -moz-border-radius: 10px;
+
-
            -webkit-border-radius: 10px;                
+
-
        }
+
-
            #navLaksh li.sub:hover > a {
+
-
                border-radius: 10px 10px 0 0;
+
-
                -moz-border-radius: 10px 10px 0 0;
+
-
                -webkit-border-radius: 10px 10px 0 0;      
+
-
            }
+
-
            #navLaksh li a {
+
#nav li a span { /*i dont know what this is about*/
-
                color: #fff;
+
color: #FFD109;
-
                font-weight: bold;
+
}
-
                text-decoration: none;
+
-
                padding: 12px;
+
-
                display: block;
+
-
            }
+
-
                #navLaksh li a:hover { background-color: #021A1A; }       
+
-
                   
+
-
    #navLaksh li ul {
+
-
        background: #fff;
+
-
        margin-top: -2px;
+
-
        display: none; 
+
-
    }
+
-
        #navLaksh li:hover ul {
+
-
            display:block;
+
-
            position:absolute;
+
-
        }
+
-
        #navLaksh li ul {
+
#nav li a span span{ /*i dont know what this is about*/
-
            background: rgba(255,255,255,0.5);
+
color: #FFD109;
-
            padding: 10px 5px;
+
}
-
           
+
 
-
            box-shadow: 5px 5px 25px #000;
+
#nav li a span span span{ /*i dont know what this is about*/
-
            -moz-box-shadow: 5px 5px 25px #000;
+
color: #FFD109;
-
            -webkit-box-shadow: 5px 5px 25px #000;
+
}
-
           
+
 
-
            border-radius: 0px 15px 15px 15px;
+
#nav li.on a {
-
            -moz-border-radius: 0px 15px 15px 15px;
+
border-bottom: 2px solid black;
-
            -webkit-border-radius: 0px 5px 5px 5px;
+
color: #000000;   /*the color of HOME by default*/
-
        }
+
}
-
            #navLaksh li ul li a, #navLaksh li ul li a:hover {
+
 
-
                background: transparent;
+
#nav li.on2 a {    /*i dont know what this is about*/
-
                color: #000;
+
border-bottom: 2px solid blue;
-
                width: 150px;
+
color: aqua;
-
                font-size: 0.95em;
+
}
-
                font-weight: normal;
+
 
-
            }
+
#nav li.on a:hover {
-
                #navLaksh li ul li a:hover { text-decoration: underline;  
+
color: #2ab117;
-
                    box-shadow: none;
+
}
-
                    -moz-box-shadow: none;
+
 
-
                    -webkit-box-shadow: none;
+
#nav li.on a:hover span{
-
                           
+
color:#2ab117;
-
                    border-radius: 0;
+
}
-
                    -moz-border-radius: 0;
+
 
-
                    -webkit-border-radius: 0;
+
#nav li.on ul a, #nav li.off ul a {
-
                }
+
/*float: center; ie doesn't inherit the float*/
 +
border: 0;
 +
font-size:12px;
 +
color: #2ab117;
 +
width: auto;
 +
margin-right: 0px;
 +
/*text-align: center;*/
 +
}
 +
#nav li.on ul {
 +
display: block;
 +
}
 +
#nav li.off:hover ul {
 +
display: inline;
 +
z-index: 6000;
 +
}
 +
#nav li.off a:hover, #nav li:hover a {  /* this is for the background that opens behind the submenu */
 +
background:white;
 +
color: black;
 +
height: 54px;
 +
width: 150px;
 +
}
 +
 
 +
#nav li.off a:hover span, #nav li:hover a {
 +
background: white;
 +
color: #2ab117;
 +
width: 150px;
 +
}
Line 97: Line 142:
<body>  
<body>  
-
<ul id="navLaksh">
+
<ul id="nav">
<li class="on"><a href="https://2012.igem.org/Team:TU-Delft">Home</a></li>
<li class="on"><a href="https://2012.igem.org/Team:TU-Delft">Home</a></li>

Revision as of 02:20, 27 October 2012

Menu

Retrieved from "http://2012.igem.org/Team:TU-Delft/Test"