Difference between revisions of "Template:Bielefeld-CeBiTec/Header"

Line 1: Line 1:
 
<html lang="en">
 
<html lang="en">
 
   <script>
 
   <script>
−
     (function($){
+
 
 +
      
 +
      $(function(){
 +
$(".dropdown-menu > li > a.trigger").on("click",function(e){
 +
var current=$(this).next();
 +
var grandparent=$(this).parent().parent();
 +
if($(this).hasClass('left-caret')||$(this).hasClass('right-caret'))
 +
$(this).toggleClass('right-caret left-caret');
 +
grandparent.find('.left-caret').not(this).toggleClass('right-caret left-caret');
 +
grandparent.find(".sub-menu:visible").not(current).hide();
 +
current.toggle();
 +
e.stopPropagation();
 +
});
 +
$(".dropdown-menu > li > a:not(.trigger)").on("click",function(){
 +
var root=$(this).closest('.dropdown');
 +
root.find('.left-caret').toggleClass('right-caret left-caret');
 +
root.find('.sub-menu:visible').hide();
 +
});
 +
});
 +
   
 +
   
 +
   
 +
   
 +
   
 +
   
 +
   
 +
   
 +
   
 +
   
 +
   
 +
    </script> 
 +
   
 +
    <!--wieder ins script einbinden    (function($){
 
$(document).ready(function(){
 
$(document).ready(function(){
 
$('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) {
 
$('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) {
Line 10: Line 42:
 
});
 
});
 
});
 
});
−
})(jQuery);</script>
+
})(jQuery);-->
  
 
<head>
 
<head>
Line 40: Line 72:
  
 
<body>
 
<body>
−
 
+
   
−
        <nav class="navbar navbar-inverse navbar-static-top marginBottom-0" role="navigation">
+
    <div class="dropdown" style="position:relative">
−
            <div class="navbar-header">
+
<a href="#" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Click Here <span class="caret"></span></a>
−
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
+
<ul class="dropdown-menu">
−
                    <span class="sr-only">Toggle navigation</span>
+
<li>
−
                    <span class="icon-bar"></span>
+
<a class="trigger right-caret">Level 1</a>
−
                    <span class="icon-bar"></span>
+
<ul class="dropdown-menu sub-menu">
−
                    <span class="icon-bar"></span>
+
<li><a href="#">Level 2</a></li>
−
                </button>
+
<li>
−
              <a class="navbar-brand" href="#" target="_blank">NewWindow</a>
+
<a class="trigger right-caret">Level 2</a>
−
            </div>
+
<ul class="dropdown-menu sub-menu">
−
           
+
<li><a href="#">Level 3</a></li>
−
            <div class="collapse navbar-collapse" id="navbar-collapse-1">
+
<li><a href="#">Level 3</a></li>
−
                <ul class="nav navbar-nav">
+
<li>
−
                    <li class="active"><a href="#">Active Link</a></li>
+
<a class="trigger right-caret">Level 3</a>
−
                    <li><a href="#">Link</a></li>
+
<ul class="dropdown-menu sub-menu">
−
                    <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+
<li><a href="#">Level 4</a></li>
−
                        <ul class="dropdown-menu">
+
<li><a href="#">Level 4</a></li>
−
                            <li><a href="#">Dropdown Link 1</a></li>
+
<li><a href="#">Level 4</a></li>
−
                            <li><a href="#">Dropdown Link 2</a></li>
+
</ul>
−
                            <li><a href="#">Dropdown Link 3</a></li>
+
</li>
−
                            <li class="divider"></li>
+
</ul>
−
                            <li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Link 4</a>
+
</li>
−
<ul class="dropdown-menu">
+
<li><a href="#">Level 2</a></li>
−
<li><a href="#">Dropdown Submenu Link 4.1</a></li>
+
</ul>
−
<li><a href="#">Dropdown Submenu Link 4.2</a></li>
+
</li>
−
<li><a href="#">Dropdown Submenu Link 4.3</a></li>
+
<li><a href="#">Level 1</a></li>
−
<li><a href="#">Dropdown Submenu Link 4.4</a></li>
+
<li><a href="#">Level 1</a></li>
−
</ul>
+
</ul>
−
</li>
+
</div>
−
                            <li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Link 5</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.2</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.3</a></li>
+
−
<li class="divider"></li>
+
−
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Submenu Link 5.4</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.4.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.2</a></li>
+
−
<li class="divider"></li>
+
−
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Submenu Link 5.4.3</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.2</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.3</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.4</a></li>
+
−
</ul>
+
−
</li>
+
−
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Submenu Link 5.4.4</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.2</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.3</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.4</a></li>
+
−
</ul>
+
−
</li>
+
−
</ul>
+
−
</li>
+
−
</ul>
+
−
</li>
+
−
                        </ul>
+
−
                    </li>
+
−
                    <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+
−
                        <ul class="dropdown-menu">
+
−
                            <li><a href="#">Dropdown Link 1</a></li>
+
−
                            <li><a href="#">Dropdown Link 2</a></li>
+
−
                            <li><a href="#">Dropdown Link 3</a></li>
+
−
                            <li class="divider"></li>
+
−
                            <li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Link 4</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 4.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 4.2</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 4.3</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 4.4</a></li>
+
−
</ul>
+
−
</li>
+
−
                            <li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Link 5</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.2</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.3</a></li>
+
−
<li class="divider"></li>
+
−
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Submenu Link 5.4</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.4.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.2</a></li>
+
−
<li class="divider"></li>
+
−
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Submenu Link 5.4.3</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.2</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.3</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.3.4</a></li>
+
−
</ul>
+
−
</li>
+
−
<li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown Submenu Link 5.4.4</a>
+
−
<ul class="dropdown-menu">
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.1</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.2</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.3</a></li>
+
−
<li><a href="#">Dropdown Submenu Link 5.4.4.4</a></li>
+
−
</ul>
+
−
</li>
+
−
</ul>
+
−
</li>
+
−
</ul>
+
−
</li>
+
−
                        </ul>
+
−
                    </li>
+
−
                </ul>
+
−
            </div><!-- /.navbar-collapse -->
+
−
        </nav>
+
  
 
<!-- <nav class="navbar navbar-default navbar-fixed-top">
 
<!-- <nav class="navbar navbar-default navbar-fixed-top">
Line 289: Line 238:
  
 
   </div>
 
   </div>
−
</nav> -->
+
</nav>
  
  
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 14:56, 15 September 2015

iGEM Bielefeld 2015

Click Here