Difference between revisions of "Team:UCSC/NavBar"

Line 7: Line 7:
 
<body>
 
<body>
  
  <ul class="topnav" id="myTopnav">
+
<nav class="topnav" id="myTopnav">
      <li><a href="https://2018.igem.org/Team:UCSC">Home</a></li>
+
  <a class="nav-logo" href="https://2018.igem.org/Team:UCSC">
      <div class="dropdown">
+
    <img class="nav-logo-img" src="https://static.igem.org/mediawiki/2018/2/2f/T--UCSC--NavbarLogo.png" height="45" width="auto" title="" style="">
        <li class="dropbtn"><a href="#">Team</a>
+
  </a>
 +
 
 +
  <div class="nav-links-container">
 +
    <a href="https://2018.igem.org/Team:UCSC">Home</a>
 +
 
 +
    <div class="dropdown">
 +
      <div class="dropbtn"><a href="#">Team</a>
 
           <i class="fa fa-caret-down"></i>
 
           <i class="fa fa-caret-down"></i>
        </li>
 
        <ul class="dropdown-content">
 
          <li><a href="https://2018.igem.org/Team:UCSC/Team">Meet the Team</a></li>
 
          <li><a href="https://2018.igem.org/Team:UCSC/Collaborations">Collaborations</a></li>
 
          <li><a href="https://2018.igem.org/Team:UCSC/Attributions">Attributions</a></li>
 
        </ul>
 
 
       </div>
 
       </div>
       <div class="dropdown">
+
       <ul class="dropdown-content">
         <li class="dropbtn"><a href="#">Project</a>
+
         <li><a href="https://2018.igem.org/Team:UCSC/Team">Meet the Team</a></li>
          <i class="fa fa-caret-down"></i>
+
        <li><a href="https://2018.igem.org/Team:UCSC/Collaborations">Collaborations</a></li>
        </li>
+
        <li><a href="https://2018.igem.org/Team:UCSC/Attributions">Attributions</a></li>
        <ul class="dropdown-content">
+
      </ul>
          <li><a href="https://2018.igem.org/Team:UCSC/Description">Description</a></li>
+
    </div>
          <li><a href="https://2018.igem.org/Team:UCSC/Metabolic_Engineering">Metabolic Engineering</a></li>
+
 
          <li><a href="https://2018.igem.org/Team:UCSC/Model">Modeling</a></li>
+
    <div class="dropdown">
          <li><a href="https://2018.igem.org/Team:UCSC/Results">Results</a></li>
+
    <div class="dropbtn"><a href="#">Project</a>
          <li><a href="https://2018.igem.org/Team:UCSC/Target_Organism">Target Organism</a></li>
+
      <i class="fa fa-caret-down"></i>
          <li><a href="https://2018.igem.org/Team:UCSC/Parts">Parts</a></li>
+
    </div>
        </ul>
+
    <ul class="dropdown-content">
      </div>
+
      <li><a href="https://2018.igem.org/Team:UCSC/Project">The Project</a></li>
      <li><a href="https://2018.igem.org/Team:UCSC/Safety">Safety</a></li>
+
      <li><a href="https://2018.igem.org/Team:UCSC/Metabolic_Engineering">Metabolic Engineering</a></li>
      <li><a href="https://2018.igem.org/Team:UCSC/Human_Practices">Human Practices</a></li>
+
      <li><a href="https://2018.igem.org/Team:UCSC/Modeling">Modeling</a></li>
      <li><a href="https://2018.igem.org/Team:UCSC/Awards">Awards</a></li>
+
      <li><a href="https://2018.igem.org/Team:UCSC/Results">Results</a></li>
      <li><a href="https://2018.igem.org/Team:UCSC/Contact">Contact</a></li>
+
      <li><a href="https://2018.igem.org/Team:UCSC/Target_Organism">Target Organism</a></li>
      <li><a href="javascript:void(0);" class="icon" onclick="myFunction()">
+
      <li><a href="https://2018.igem.org/Team:UCSC/Parts">Parts</a></li>
        <i class="fa fa-bars"></i>
+
    </ul>
      </a></li>
+
    </div>
  </ul>
+
 
 +
    <a href="https://2018.igem.org/Team:UCSC/Safety">Safety</a>
 +
    <a href="https://2018.igem.org/Team:UCSC/Human_Practices">Human Practices</a>
 +
    <a href="https://2018.igem.org/Team:UCSC/Awards">Awards</a>
 +
    <a href="https://2018.igem.org/Team:UCSC/Contact">Contact</a>
 +
  </div>
 +
 
 +
  <a href="javascript:void(0);" class="icon" onclick="myFunction()">
 +
    <i class="fa fa-bars"></i>
 +
  </a>
 +
</nav>
  
  <script type="text/javascript">
+
<script type="text/javascript">
  
  /* Toggle between adding and removing the "responsive" class to topnav when the user clicks on the icon */
+
/* Toggle between adding and removing the "responsive" class to topnav when the user clicks on the icon */
  function myFunction() {
+
function myFunction() {
      var x = document.getElementById("myTopnav");
+
  var x = document.getElementById("myTopnav");
      if (x.className === "topnav") {
+
  if (x.className === "topnav") {
          x.className += " responsive";
+
      x.className += " responsive";
      } else {
+
  } else {
          x.className = "topnav";
+
      x.className = "topnav";
      }
+
  }
  }
+
}
  </script>
+
</script>
  
  </body>
+
</body>
  </html>
+
</html>

Revision as of 16:07, 5 July 2018