¿Por qué se mantiene SIEMPRE el primer elemento "li" del menú aunque clicke en otro?
Si en lugar de poner la dirección donde debe ir cada "li" simplemente añado un href="#" me funciona pero con la dirección no funciona.
Código:
$(document).ready(function() {
$('ul li a').click(function() {
$('li a').removeClass("active");
$(this).addClass("active");
});
});
#menu_horizontal li {
list-style: none;
display: inline;
margin-left: 10px;
}
#menu_horizontal li a {
padding: 3px 1em;
border: 1px solid #778;
border-bottom: none;
background: #DDE;
text-decoration: none;
}
#menu_horizontal li a:link {
color: #448;
}
#menu_horizontal li a:hover {
color: white;
background: red;
border-color: #227;
}
#menu_horizontal .active {
background: red;
color: white;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="menu_horizontal">
<li class="nueva" id="nueva"><a class="active" href="menu_cliente.php?nueva=1">NUEVA OPINIÓN</a></li>
<li class="ver" id="ver"><a href="menu_cliente.php?ver=1">VER OPINIONES</a></li>
<li class="eliminar" id="eliminar"><a href="menu_cliente.php?eliminar=1">ELIMINAR OPINIÓN</a></li>
<li class="datos_cliente" id="datos_cliente"><a href="menu_cliente.php?datos_cliente=1">DATOS PERSONALES</a></li>
</ul>
ID
eso es incorrecto, sólo puede tener uno.