User:Vinoo/AccordionMenu

From 2014.igem.org

< User:Vinoo(Difference between revisions)
m
m
 
(5 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
<style type="text/css">
<style type="text/css">
-
.acc_menu,
+
#acc_menu,
-
.acc_menu ul,
+
#acc_menu ul,
-
.acc_menu li,
+
#acc_menu li,
-
.acc_menu a,
+
#acc_menu a,
-
.acc_menu span {
+
#acc_menu span {
     margin: 0;
     margin: 0;
     padding: 0;
     padding: 0;
Line 12: Line 12:
}
}
   
   
-
.acc_menu li {
+
#acc_menu li {
     list-style: none;
     list-style: none;
}
}
-
.acc_menu li > a {
+
#acc_menu li > a {
     display: block;
     display: block;
     position: relative;
     position: relative;
Line 27: Line 27:
}
}
-
.sub_menu li a {
+
#sub_menu li a {
     color: #000;
     color: #000;
-
     padding: 5px 10px 5px 20px;
+
    height: 25;
 +
     padding: 5px 0px 5px 20px;
     font: bold 12px Arial, sans-serif;
     font: bold 12px Arial, sans-serif;
}
}
-
.acc_menu li > .sub_menu {
+
#acc_menu li > #sub_menu {
     height: 0;
     height: 0;
     overflow: hidden;
     overflow: hidden;
Line 44: Line 45:
}
}
   
   
-
.acc_menu li:target > .sub_menu {
+
#acc_menu li:target > #sub_menu {
-
     height: 98px;
+
     min-height: 75px;
}
}
-
.acc_menu > li:hover > a,
+
#acc_menu > li:hover > a,
-
.acc_menu > li:target > a {
+
#acc_menu > li:target > a {
-
    color: #3e5706;
+
     color: #000;
-
    text-shadow: 1px 1px 1px rgba(255,255,255, .2);
+
     background: #d9f5aa;
-
+
-
    /*background: url(../img/active.png) repeat-x;*/
+
-
    background: #a5cd4e;
+
-
    background: -moz-linear-gradient(top,  #a5cd4e 0%, #6b8f1a 100%);
+
-
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a5cd4e), color-stop(100%,#6b8f1a));
+
-
    background: -webkit-linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
+
-
    background: -o-linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
+
-
    background: -ms-linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
+
-
    background: linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
+
-
}
+
-
+
-
.acc_menu > li:hover > a span,
+
-
.acc_menu > li:target > a span {
+
-
     color: #fdfdfd;
+
-
    text-shadow: 0px 1px 0px rgba(0,0,0, .35);
+
-
     background: #3e5706;
+
}
}
   
   
-
.sub_menu li:hover a { background: #efefef; }
+
#sub_menu li:hover a { background: #d9f5aa; }
</style>
</style>
-
<ul class="acc_menu">
+
<ul id="acc_menu">
-
<li id="one"><a href="#">Art & Design</a>
+
<li id="one"><a href="#one">Art & Design</a>
-
<ul class="sub_menu">
+
<ul id="sub_menu">
<li><a href="#">Information</a>
<li><a href="#">Information</a>
<li><a href="#">Track Committee</a>
<li><a href="#">Track Committee</a>
Line 83: Line 68:
</li>
</li>
-
<li id="one"><a href="#">Community Labs</a>
+
<li id="two"><a href="#two">Community Labs</a>
-
<ul class="sub_menu">
+
<ul id="sub_menu">
<li><a href="#">Information</a>
<li><a href="#">Information</a>
<li><a href="#">Track Committee</a>
<li><a href="#">Track Committee</a>
Line 91: Line 76:
</li>
</li>
-
<li id="one"><a href="#">Entrepreneurship</a>
+
<li id="three"><a href="#three">Entrepreneurship</a>
-
<ul class="sub_menu">
+
<ul id="sub_menu">
<li><a href="#">Information</a>
<li><a href="#">Information</a>
<li><a href="#">Track Committee</a>
<li><a href="#">Track Committee</a>
Line 99: Line 84:
</li>
</li>
-
<li id="one"><a href="#">Measurement</a>
+
<li id="four"><a href="#four">Measurement</a>
-
<ul class="sub_menu">
+
<ul id="sub_menu">
<li><a href="#">Information</a>
<li><a href="#">Information</a>
<li><a href="#">Track Committee</a>
<li><a href="#">Track Committee</a>
Line 107: Line 92:
</li>
</li>
-
<li id="one"><a href="#">Microfluidics</a>
+
<li id="five"><a href="#five">Microfluidics</a>
-
<ul class="sub_menu">
+
<ul id="sub_menu">
<li><a href="#">Information</a>
<li><a href="#">Information</a>
<li><a href="#">Track Committee</a>
<li><a href="#">Track Committee</a>
Line 115: Line 100:
</li>
</li>
-
<li id="one"><a href="#">Policy & Practices</a>
+
<li id="six"><a href="#six">Policy & Practices</a>
-
<ul class="sub_menu">
+
<ul id="sub_menu">
<li><a href="#">Information</a>
<li><a href="#">Information</a>
<li><a href="#">Track Committee</a>
<li><a href="#">Track Committee</a>
Line 123: Line 108:
</li>
</li>
-
<li id="one"><a href="#">Software</a>
+
<li id="seven"><a href="#seven">Software</a>
-
<ul class="sub_menu">
+
<ul id="sub_menu">
<li><a href="#">Information</a>
<li><a href="#">Information</a>
<li><a href="#">Track Committee</a>
<li><a href="#">Track Committee</a>

Latest revision as of 20:04, 12 December 2013