Difference between revisions of "Team:Bielefeld-CeBiTec/Basic Navbar"

 
(30 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{:Team:Bielefeld-CeBiTec/CSS}}
 
{{:Team:Bielefeld-CeBiTec/Navbar_JS}}
 
 
 
 
<html lang="en">
 
<html lang="en">
 
<head>
 
<head>
Line 8: Line 4:
 
   <meta charset="utf-8">
 
   <meta charset="utf-8">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
+
 
 +
<link rel="stylesheet" type="text/css"
 +
href="https://2018.igem.org/Team:Bielefeld-CeBiTec/CSS?action=raw&ctype=text/css" />
 
    
 
    
 
<script>
 
<script>
$(document).ready(function(){
+
(function($) {
  // the event is fired when the dropdown is shown to the user
+
  $(function() {  
$("#dd-example").on('shown.bs.dropdown', function()
+
   
   { alert("the drop down has been shown");});
+
    $('nav ul li a:not(:only-child)').click(function(e) {
 
+
      $(this).siblings('.nav-dropdown').toggle();
  $(".dropdown-toggle").dropdown();
+
      $('.nav-dropdown').not($(this).siblings()).hide();
 
+
      e.stopPropagation();
});  
+
    });
</script>
+
    
 +
    $('html').click(function() {
 +
      $('.nav-dropdown').hide();
 +
    });
 +
    $('#nav-toggle').click(function() {
 +
      $('nav ul').slideToggle();
 +
    });
 +
    $('#nav-toggle').on('click', function() {
 +
      this.classList.toggle('active');
 +
    });
 +
  });  
 +
})(jQuery);
  
<style>
 
  
.collapse.navbar-collapse {
 
float:right;
 
                padding: 0;
 
                padding-right: 5%;
 
}
 
  
@media (max-width: 1210px) and (min-width: 1060px){
 
.navbar-nav > li {
 
    float: left;
 
    font-size: 0.8em;
 
}}
 
  
@media (max-width: 1060px){
 
.logo-img {
 
    margin-top:1%;
 
}
 
#myNavbar {
 
    float: none;
 
    padding: 0;
 
    padding-right: 0;
 
}
 
  
#span-button {
 
    margin-top: 2%
 
}
 
 
.navbar-toggle {
 
    display: block;
 
}}
 
 
 
 
</style>
 
  
 +
</script>
  
 
</head>
 
</head>
 +
<body>
  
 +
<section class="navigation" style="z-index:100">
 +
  <div class="nav-container">
 +
    <div class="brand">
 +
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec"><img class="logo-img" src="https://static.igem.org/mediawiki/2018/1/1b/T--Bielefeld-CeBiTec--nanofactory_navbar_vk.png"></a>
 +
    </div>
 +
    <nav>
 +
      <div class="nav-mobile"><a id="nav-toggle" href="#!"><span></span></a></div>
 +
      <ul class="nav-list">
 +
        <li>
 +
          <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec">Home</a>
 +
        </li>
 +
        <li>
 +
          <a href="#!">Project</a>
 +
          <ul class="nav-dropdown">
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Motivation">Motivation</a>
 +
            </li>
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Description">Overview</a>
 +
            </li>
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Toxicity_Theory">Toxicity</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Accumulation">Accumulation</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/siRNA">Silencing</a>
 +
            </li>
  
<body>
+
           
 
+
<li>
<div class="w3-top">
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Ferritin">Nanoparticles</a>
<nav class="navbar navbar-inverse">
+
            </li>
  <div class="container-fluid">
+
          </ul>
<div class="navbar-header">
+
        </li><li>
  <button id="span-button" type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
+
          <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Model">Modeling</a>
<span class="icon-bar"></span>
+
        </li><li>
<span class="icon-bar"></span>
+
          <a href="#!">Results</a>
<span class="icon-bar"></span>                      
+
          <ul class="nav-dropdown">
  </button>
+
<li>
  <img class="logo-img" src="https://static.igem.org/mediawiki/2018/a/ad/T--Bielefeld-CeBiTec--Logo_invertiert.jpg" width="60">
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Results">Results Overview</a>
</div>
+
            </li>
<div class="collapse navbar-collapse" id="myNavbar">
+
<li>
  <ul class="nav navbar-nav center">
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Toxicity_Results">Toxicity Results</a>
<li>
+
            </li>
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec">Home</a>
+
<li>
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Accumulation_Results">Accumulation Results</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/siRNA_Results">Silencing Results</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Ferritin_Results">Nanoparticles Results</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/InterLab">InterLab</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Demonstrate">Demonstrate</a>
 +
            </li>
 +
          </ul>
 +
        </li>
  
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Project <span class="caret"></span></a>
+
<li>
<ul class="dropdown-menu">
+
          <a href="#!">Parts</a>
<li>
+
          <ul class="nav-dropdown">
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Description">Overview</a>
+
            <li>
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Parts">Parts Overview</a>
<li>
+
            </li><li>
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Design">Design</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Basic_Part">Basic Parts</a>
</li>
+
            </li>
<li>
+
<li>
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Experiments">Experiments</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Composite_Part">Composite Parts</a>
</li>
+
            </li>
<li>
+
<li>
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/InterLab">InterLab</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Part_Collection">Parts Collection</a>
</li>
+
            </li>
<li>
+
<li>
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Demonstrate">Demonstrate</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Improve">Parts Improvement</a>
</li>
+
            </li>
<li>
+
          </ul>
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Improve">Improve</a>
+
        </li>
</li>
+
</ul>
+
</li>
+
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Model">Modelling</a>
+
</li>  
+
+
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Results <span class="caret"></span></a>
+
<ul class="dropdown-menu">
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Results">Results Overview</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Parts">Parts Overview</a>
+
</li>
+
<li>
+
  <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Basic_Part">Basic Parts</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Composite_Part">Composite Parts</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Part_Collection">Part Collection</a>
+
</li>
+
</ul>
+
</li>
+
+
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Human Practices <span class="caret"></span></a>
+
<ul class="dropdown-menu">
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Human_Practices">Human Practices</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Public_Engagement">Education and Engagement</a>
+
</li>
+
</ul>
+
</li>
+
+
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Awards <span class="caret"></span></a>
+
<ul class="dropdown-menu">
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Applied_Design">Applied Design</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Entrepreneurship">Entrepreneurship</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Hardware">Hardware</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Measurement">Measurement</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Model">Model</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Plant">Plant</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Software">Software</a>
+
</li>
+
</ul>
+
</li>
+
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Notebook">Notebook</a>
+
</li>
+
+
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Team <span class="caret"></span></a>
+
<ul class="dropdown-menu">
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Team">Team Members</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Bielefeld">Bielefeld</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/CeBiTec">CeBiTec</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Bielefeld-University">Bielefeld University</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Collaborations">Collaborations</a>
+
</li>
+
<li>
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Attributions">Attributions</a>
+
</li>
+
</ul>
+
</li>
+
+
<li>
+
<a href="https://igem.org/2018_Judging_Form?team=Bielefeld-CeBiTec">Judging Form ⇗</a>
+
</li>
+
+
</ul>
+
  
</div>
+
<li>
</div>
+
          <a href="#!">Human Practices</a>
</nav>
+
          <ul class="nav-dropdown">
</div>
+
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Human_Practices">Human Practices</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Public_Engagement">Outreach</a>
 +
            </li>
 +
          </ul>
 +
        </li><li>
 +
          <a href="#!">Awards</a>
 +
          <ul class="nav-dropdown">
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Hardware">Hardware</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Software">Software</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Measurement">Measurement</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Design">Product Design</a>
 +
            </li>
 +
          </ul>
 +
        </li><li>
 +
          <a href="#!">Notebook</a>
 +
          <ul class="nav-dropdown">
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Notebook">Notebook</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Experiments">Experiments</a>
 +
            </li>
 +
          </ul>
 +
        </li><li>
 +
          <a href="#!">Team</a>
 +
          <ul class="nav-dropdown">
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Team">Members</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Bielefeld">Bielefeld</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/CeBiTec">CeBiTec</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Bielefeld-University">Bielefeld University</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Collaborations">Collaborations</a>
 +
            </li><li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Attributions">Attributions</a>
 +
            </li>
 +
          </ul>
 +
        </li><li>
 +
          <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Partners">Partners</a>
 +
        </li><li>
 +
          <a href="https://igem.org/2018_Judging_Form?team=Bielefeld-CeBiTec">Judging Form ⇗</a>
 +
        </li>
 +
      </ul>
 +
    </nav>
 +
  </div>
 +
</section>
  
  
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 03:20, 18 October 2018