I was creating the menu of my system and everything was working correctly, the file menuHorizontal.php contains the menu and it has a dropdown that was working, when I click, it opens the submenu, so that's fine, the problem is which now in the index.php file, I put it in line 2 require_once("menuHorizontal.php") ; and going in the index.php, the menu appears right the problem is when I click on the dropdown, it does not descend, it works the "hover" function that I put, however the dropdown does not go down. Any idea?
index.php
<?php
require_once("menuVertical.php");
require_once("menuHorizontal.php");
?>
<!DOCTYPE html>
<html>
<head>
<title>Menu</title>
</head>
<body>
</body>
</html>
menuHorizontal.php
<!DOCTYPE html>
<html>
<head>
<title>Menu</title>
<link href="http://netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css" rel="stylesheet" />
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/menu_js.js"></script>
<link rel="stylesheet" type="text/css" href="css/menu_style.css" />
<script type="text/javascript" src="css/jquery-2.0.0.min.js" /></script>
<link href="css/font-awesome.min.css" rel="stylesheet" />
<link href="css/font-awesome.css" rel="stylesheet" />
<!--[if IE 7]>
<link href="http://netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome-ie7.min.css" rel="stylesheet" />
<![endif]-->
</head>
<div class="longBarHorizontal">
<!-- INICIO DO HEADER HORIZONTAL -->
<nav class="navbar navbar-default navbar-fixed-top" style="margin-left: 300px; min-height: 40px; height: 41px;">
<div class="container-fluid" style="background-color: rgb(49, 50, 64);">
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li style="height: 45px; margin-top: -5px;">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" style="height: 45px;">
<span>Requisições</span><i class="icon-caret-down"></i>
</a>
<ul class="dropdown-menu dropdown-cart" role="menu" style="max-height: 85vh; overflow-x: hidden;">
<li>
<span class="item">
<span class="item-left">
<span class="item-info">
<span> <b>Paciente:</b> Lorem ipsum dolor sit amet </span>
<span> <b>Requisição N°:</b> 220 </span>
<span> <b>Atendimento N°:</b> 4933 </span>
<span> <b>Setor Solicitante:</b> Emergência </span>
</span>
</span>
</span>
<hr style="margin: 10px;">
<span class="item">
<span class="item-left">
<span class="item-info">
<span> <b>Paciente:</b> Lorem ipsum dolor sit amet </span>
<span> <b>Requisição N°:</b> 222 </span>
<span> <b>Atendimento N°:</b> 9844 </span>
<span> <b>Setor Solicitante:</b> Ambulatorial </span>
</span>
</span>
</span>
<hr style="margin: 10px;">
</li>
<!--<li class="divider"></li>-->
<li><a class="text-center" href="" style="margin-bottom: 10px;">Ver Todas</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<!-- FIM DO HEADER HORIZONTAL -->
</div>
<body>
</body>
</html>
javascript
jQuery(document).ready(function() {
jQuery('ul.form li a').click(
function(e) {
e.preventDefault(); // prevent the default action
e.stopPropagation; // stop the click from bubbling
jQuery(this).closest('ul').find('.selected').removeClass('selected');
jQuery(this).parent().addClass('selected');
});
});