Team:UI-Indonesia/header

From 2013.igem.org

(Difference between revisions)
Line 44: Line 44:
</header>
</header>
-
 
<div>
<div>
-
<menu>
+
 
 +
<!-- *** Menu Style CSS From MIT 2012, Thankyou..!! :D *** -->
<style>
<style>
-
#nav { font-family: "Trebuchet MS", sans-serif; font-size: 15px; color: white;}  
+
#menubar {  
-
#nav { background-image: url(https://static.igem.org/mediawiki/2013/5/5e/Menubar_background.png); height:39px; list-style: none; position:center; }
+
    background-color: white;  
-
#nav { float: left;}
+
}
-
#nav li { float: left; margin: 0px; position:relative; }
+
#menubar ul li a {  
-
#nav a { display: block; padding: 5px 15px; text-decoration: none; color: white; border-style: none; }
+
    color: #999999; }
-
#nav a:hover { color: #f9fd92; }
+
    .right-menu li a {
-
</style>
+
    color: black;
 +
    background-color: white;
 +
}
 +
.nav{
 +
float:left;
 +
width:100%;
 +
margin:0;
 +
list-style:none;
 +
position:relative;
 +
z-index:5;
 +
/*CHANGE THIS TO CENTER*/
 +
padding:0 12px; /*12px;*/
 +
}
 +
 +
.nav li{
 +
float:left;
 +
position:relative;
 +
display:inline;
 +
line-height: 2em;
 +
}
 +
 +
.nav a{
 +
float:left;
 +
height:2em;
 +
padding: 0 1.3em;
 +
color:white;
 +
background-color:#666666;
 +
/*Padding: bottom, right, top, left */
 +
/*padding:0.2em 1.3em 0.2em 1.3em;*/
 +
border-right:1px solid white;
 +
white-space:nowrap;
 +
}
 +
 +
.nav a:hover{
 +
background-color:#993333 !important;
 +
}
 +
 +
/*--- DROPDOWN ---*/
 +
.nav ul{
 +
background:#fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
 +
background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
 +
list-style:none;
 +
position:absolute;
 +
left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
 +
margin-top: 25px;
 +
margin-left:0;
 +
margin-right:0;
 +
 +
}
 +
 +
 +
.nav ul li{
 +
padding-top:1px;
 +
}
 +
 +
.nav ul a{
 +
padding-top: 3px;
 +
padding-bottom:3px; /*Introducing a padding between the li and the a give the illusion spaced items */
 +
white-space:normal;
 +
text-decoration:none;
 +
height:auto;
 +
width: 13em;
 +
line-height: 1.5em;
 +
}
 +
 +
.nav li:hover ul{ /* Display the dropdown on hover */
 +
left:0; /* Bring back on-screen when needed */
 +
text-decoration:none;
 +
}
 +
 +
.nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
 +
background:#666666;
 +
text-decoration:none;
 +
}
 +
 +
.nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
 +
text-decoration:none;
 +
}
 +
 +
.nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
 +
background:#993333;
 +
text-decoration:none;
 +
}
 +
</style>
 +
<!-- *** End of Menubar CSS style code from MIT, Thankyouuu :D *** -->
<div id="border-top"></div>   
<div id="border-top"></div>   
-
<ul id="nav">
+
 
-
<li><a href="https://2013.igem.org/Team:UI-Indonesia">HOME</a></li>
+
<!-- *** Percobaan kode menu dropdown MIT *** -->
-
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Parts">PARTS</a></li>
+
<ul class="nav">
 +
 
 +
<li><a href="https://2013.igem.org/Team:UI-Indonesia">HOME</a></li>
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Team">TEAM</a></li>
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Team">TEAM</a></li>
-
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Project">PROJECT</a></li>
+
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Project">PROJECT</a>
-
<li><a href="https://2013.igem.org/Team:UI-Indonesia/HumanPractices">HUMAN PRACTICES</a></li>
+
<ul>
 +
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Description">Description</a></li>
 +
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Device">Device</a></li>
 +
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Parts">Parts</a></li>
 +
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Abstract">Abstract</a></li>
 +
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Results">Results</a></li>
 +
<li><a href="https://2013.igem.org/Team:UI-Indonesia/JudgingForm">Judging Form</a></li>
 +
</ul></li>
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Notebook">NOTEBOOK</a></li>
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Notebook">NOTEBOOK</a></li>
-
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Safety">SAFETY</a></li>
+
        <li><a href="https://2013.igem.org/Team:UI-Indonesia/Safety">SAFETY</a></li>
-
<li><a href="https://2013.igem.org/Team:UI-Indonesia/Outreach">OUTREACH</a></li>
+
        <li><a href="https://2013.igem.org/Team:UI-Indonesia/HumanPractices">HUMAN PRACTICES</a></li>
-
<li><a href="https://2013.igem.org/Team:UI-Indonesia/About">ABOUT US</a></li>
+
        <li><a href="https://2013.igem.org/Team:UI-Indonesia/Sponsors">Sponsors</a></li>
-
</menu>
+
 
-
</div>
+
<!-- *** <li id="nav_motivation"><a href="https://2012.igem.org/Team:MIT/Motivation">MOTIVATION</a>
 +
<ul>
 +
</ul>
 +
</li>
 +
<li id="nav_results"><a href="https://2012.igem.org/Team:MIT/ResultsOverview">RESULTS</a>
 +
<ul>
 +
  <li><a href="https://2012.igem.org/Team:MIT/ResultsOverview">Overview</a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/CircuitProduction">Circuit Production</a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/NOTGate">NOT Gate</a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/Sensing">Sensing</a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/Actuation">Actuation</a></li>
 +
  <li><a style="background: #993333;" href="https://2012.igem.org/Team:MIT/TheKeyReaction"><em>Enabling The Key Reaction</em></a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/ResultsBiobricks">BioBricks</a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/ResultsAttributions">Attributions</a></li>
 +
</ul>
 +
</li>
 +
 
 +
<li id="nav_methods"><a href="https://2012.igem.org/Team:MIT/MaterialsAndMethods">METHODS</a>
 +
<ul>
 +
</ul>
 +
</li>
 +
 
 +
<li id="nav_notebook"><a href="https://2012.igem.org/Team:MIT/Notebook">NOTEBOOK</a>
 +
<ul>
 +
  <li><a href="https://2012.igem.org/Team:MIT/Notebook#constructionbio">Construction &amp; <em>In Vitro</em></a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/Notebook#springtcbio">Spring Tissue Culture</a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/Notebook#summertcbio">Summer Tissue Culture</a></li>
 +
  <li><a href="https://2012.igem.org/Team:MIT/Notebook#falltcbio">Fall Tissue Culture</a></li>
 +
</ul>
 +
</li>
 +
 
 +
<li id="nav_human_practices"><a href="https://2012.igem.org/Team:MIT/HumanPractices">HUMAN PRACTICES</a>
 +
<ul>
 +
</ul>
 +
</li>
 +
 
 +
 
 +
<li id="nav_safety"><a href="https://2012.igem.org/Team:MIT/Safety">SAFETY</a>
 +
<ul>
 +
</ul>
 +
</li>
 +
 
 +
 
 +
<li id="nav_team"><a href="https://2012.igem.org/Team:MIT/Team">TEAM</a>
 +
<ul>
 +
</ul>
 +
</li>
 +
 
 +
<li id="nav_partners"><a href="https://2012.igem.org/Team:MIT/Partners">SPONSORS</a>
 +
<ul>
 +
</ul>
 +
</li>
 +
<li id="nav_contact"><a href="https://2012.igem.org/Team:MIT/Contact">CONTACT US</a>
 +
<ul>
 +
</ul>
 +
</li>
 +
</ul> *** -->
 +
<!-- *** Percobaan kode menu dropdown MIT *** -->
<!-- *** Percobaan ikon menu oleh Teguh *** -->
<!-- *** Percobaan ikon menu oleh Teguh *** -->

Revision as of 18:06, 27 September 2013