Team:TU Eindhoven/Template:NavPanel

From 2014.igem.org

(Difference between revisions)
 
(212 intermediate revisions not shown)
Line 2: Line 2:
<head>
<head>
-
   <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+
  <meta charset='utf-8'>
-
  <title>TU Eindhoven iGEM</title>
+
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <link href="https://2014.igem.org/Team:TU_Eindhoven/Style:NavPanel?action=raw&ctype=text/css" rel="stylesheet" type="text/css" media="all" />
   <link href="https://2014.igem.org/Team:TU_Eindhoven/Style:NavPanel?action=raw&ctype=text/css" rel="stylesheet" type="text/css" media="all" />
-
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
+
  <script src="https://2014.igem.org/Team:TU_Eindhoven/Template:NavPanel/jquery-latest.min?action=raw&ctype=text/js" type="text/javascript"></script>
 +
  <script src="https://2014.igem.org/Team:TU_Eindhoven/Template:NavPanel/script?action=raw&ctype=text/js"></script>
 +
  <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
 +
</head>
-
<style>
+
<body>
-
#nav{
+
-
    list-style:none;
+
-
    font-weight:bold;
+
-
font-size: 20px;
+
-
    margin-bottom:10px;
+
-
    float:left; /* Clear floats */
+
-
    width:100%;
+
-
    /* Bring the nav above everything else--uncomment if needed.
+
-
    position:relative;
+
-
    z-index:50;
+
-
padding-top:15%;
+
-
    */
+
-
}
+
-
#nav li{
+
-
    float:left;
+
-
    margin-right:10px;
+
-
    position:relative;
+
-
}
+
<div id='cssmenu'>
-
#nav a{
+
<ul>
-
    display:block;
+
-
    padding:5px;
+
-
    color:#fff;
+
-
    background:transparent;
+
-
    text-decoration:none;
+
-
}
+
  <li><a href='https://2014.igem.org/Team:TU_Eindhoven'><span>Home</span></a></li>
-
#nav a:hover{
+
 
-
    color:#fff;
+
  <li class='has-sub'><a><span>Team ▼</span></a>
-
    background:#0040FF;
+
      <ul>
-
    text-decoration:underline;
+
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Team'><span>Team Members</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Attributions'><span>Attributions</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Team_Supervisors'><span>Supervisors</span></a></li>
 +
        <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Acknowledgements'><span>Acknowledgements</span></a></li>
 +
      </ul>
 +
  </li>
-
}
+
  <li class='has-sub'><a><span>Project ▼</span></a>
 +
      <ul>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Abstract'><span>Abstract</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Overview'><span>Overview</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project'><span>Project Description</span></a></li>
 +
        <li class='has-sub'><a href='https://2014.igem.org/Team:TU_Eindhoven/Background'><span>Background ►</span></a>
 +
            <ul>
 +
              <li><a href='https://2014.igem.org/Team:TU_Eindhoven/SPAAC'><span>SPAAC Reaction</span></a></li>
 +
              <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Background_Anchors'><span>Anchors</span></a></li>
 +
              <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/FACS'><span>FACS</span></a></li>
 +
            </ul>
 +
        </li>
 +
        <li class='has-sub'><a href='https://2014.igem.org/Team:TU_Eindhoven/Design'><span>Design ►</span></a>
 +
            <ul>
 +
              <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Design_Anchors'><span>Membrane Anchors</span></a></li>
 +
              <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Plamid_Design'><span>Plasmid Design</span></a></li>
 +
            </ul>
 +
        </li>
 +
        <li class='has-sub'><a href='https://2014.igem.org/Team:TU_Eindhoven/Click_Reaction'><span>Click Reaction ►</span></a>
 +
        </li>
 +
        <li class='has-sub'><a><span>RCA ►</span></a>
 +
            <ul>
 +
              <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Introduction'><span>Introduction</span></a></li>
 +
              <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Mechanism'><span>Mechanism</span></a></li>
 +
              <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Plamid_Design'><span>Results</span></a></li>
 +
            </ul>
 +
        </li>
 +
        <li class='has-sub'><a href='https://2014.igem.org/Team:TU_Eindhoven/ZAP'><span>ZAP</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Main_results'><span>Main Results</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Parts'><span>Submitted Parts</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Medal_motivation'><span>Medal Motivation</span></a></li>
 +
        <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Future_Perspectives'><span>Future Perspectives</span></a></li>
 +
      </ul>
 +
  </li>
 +
 
 +
  <li class='has-sub'><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Microfluidics'><span>Microfluidics ▼</span></a>
 +
      <ul>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Microfluidics_introduction'><span>Introduction</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Microfluidics_Dropletdevice'><span>Droplet Device</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Microfluidics_cellencapsulation'><span>Cell Encapsulation</span></a></li>
 +
        <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Microfluidics_results'><span>Results</span></a></li>
 +
      </ul>
 +
  </li>
-
/*--- DROPDOWN ---*/
+
  <li class='has-sub'><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Modeling'><span>Modeling</span></a></li>
-
#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;) */
+
-
}
 
-
#nav ul li{
 
-
    padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
 
-
    float:none;
 
-
}
+
  <li class="has-sub"><a href='https://2014.igem.org/Team:TU_Eindhoven/Notebook'><span>Notebook ▼</span></a>
-
#nav ul a{
+
      <ul>
-
    white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
+
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/protocols'><span>Timeline</span></a></li>
-
}
+
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/protocols'><span>Protocols</span></a></li>
 +
        <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/protocols'><span>Logbook</span></a></li>
 +
      </ul>
 +
  </li>
 +
 
 +
  <li class="has-sub"><a><span>Society ▼</span></a>
 +
      <ul>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Synergene'><span>Synergene</span></a></li>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Outreach'><span>Outreach</span></a></li>
 +
        <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Policyandpractices'><span>Policy & Practices</span></a></li>
 +
      </ul>
 +
  </li>'
-
#nav li:hover ul{ /* Display the dropdown on hover */
+
  <li class="has-sub"><a href='https://2014.igem.org/Team:TU_Eindhoven/Safety'><span>Safety ▼</span></a>
-
    left:0; /* Bring back on-screen when needed */
+
      <ul>
 +
        <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Our_lab'><span>Our Lab</span></a></li>
 +
        <li class='last'><a href='https://2014.igem.org/Team:TU_Eindhoven/Project/Biosafety'><span>Biosafety</span></a></li>
 +
      </ul>
 +
  </li>
-
}
+
  <li><a href='https://2014.igem.org/Team:TU_Eindhoven/Sponsors'><span>Sponsors</span></a></li>
-
#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:#0040FF;
+
-
    text-decoration:underline;
+
-
;
+
-
}
+
-
#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;
+
-
}
+
  <li style="margin-left:275px;padding:0;"><a href='https://2014.igem.org' target="_blank" style="padding:0;"><img src="https://static.igem.org/mediawiki/2014/0/0e/TU_Eindhoven_iGEM.png" height="80"></a></li>
-
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
+
-
    background-color:#333;
+
-
opacity:0.6;
+
-
}
+
-
#nav ul{
+
</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;) */
+
-
}
 
-
 
-
#nav ul li{
 
-
    padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
 
-
    float:none;
 
-
z-index: 40;
 
-
}
 
-
#nav ul a{
 
-
    white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
 
-
 
-
}
 
-
#nav li:hover ul{ /* Display the dropdown on hover */
 
-
    left:0; /* Bring back on-screen when needed */
 
-
 
-
}
 
-
 
-
#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: transparent;
 
-
    text-decoration:underline;
 
-
 
-
 
-
}
 
-
#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;
 
-
 
-
}
 
-
</style>
 
-
 
-
 
-
</head>
 
-
 
-
 
-
<div class="header_btm">
 
-
<div class="wrap">
 
-
<div class="header_sub">
 
-
<div class="h_menu">
 
-
<ul id="nav">
 
-
<li><a href="https://2014.igem.org/Team:TU_Eindhoven">Home</a></li>
 
-
<li><a href="https://2014.igem.org/Team:TU_Eindhoven/Team">Team</a></li>
 
-
<li><a href="https://2014.igem.org/Team:TU_Eindhoven/Project">Project</a>
 
-
<ul>
 
-
<li><a href="https://2014.igem.org/Team:TU_Eindhoven/Project">Overview</a></li>
 
-
<li><a href="https://2014.igem.org/Team:TU_Eindhoven/Project">Results</a></li>
 
-
<li><a href="https://2014.igem.org/Team:TU_Eindhoven/Project">Future Work</a></li>
 
-
</li></ul>
 
-
<li><a href="https://2014.igem.org/Team:TU_Eindhoven/Notebook">Notebook</a></li>
 
-
<li><a href="#">Safety</a></li>
 
-
                                <li><a href="https://2014.igem.org/Team:TU_Eindhoven/Sponsors">Sponsors</a></li>
 
-
</ul>
 
-
</div>
 
-
 
-
<div class="clear"></div>
 
-
<div class="clear"></div>     
 
-
 
-
<div id="iGEMLOGO" class="grayscale">
 
-
<a href="https://2014.igem.org/Main_Page">
 
-
<img src="https://static.igem.org/mediawiki/2014/4/4b/TU_Eindhoven_iGEM_LOGO.jpg" width="65px"></a>
 
-
</div>   
 
-
 
-
</div>
 
-
</div>
 
</div>
</div>
 +
</body>
-
</html>
+
<html>

Latest revision as of 18:08, 21 September 2014