I'm doing a simple menu, I want the menu item to be left where I click. I have my class activo
and my code of
I'm doing a simple menu, I want the menu item to be left where I click. I have my class activo
and my code of
What you can do is check the URL in which the user is and according to this activate the corresponding link.
The code would be something like this:
HTML
<div class="menu">
<nav>
<a href="Inicio.php">Inicio</a>
<a href="Mision.php">Mision</a>
<a href="Vision.php">Vision</a>
<a href="Nosotros.php">Nosotros</a>
<a href="Contacto.php">Contacto</a>
</nav>
</div>
CSS
.activo {
border-bottom: 10px solid white;
}
jQuery
$(document).ready(function(){
$('.menu nav a').click(function(){
$('nav a').removeClass("activo");
$(this).addClass("activo");
});
$(".menu nav a").each(function() {
if($(location).attr('href').indexOf($(this).attr("href")) >= 0)
$(this).addClass("activo");
});
});
It's very simple you have to create a small script that modifies the class of the menu according to your url:
var pach = www.midominio.com/
var url = $(location).attr('href');
var href = url.replace(pach,''); // remplazamos por vacío
$('a[href="'+href+'"]').addClass('activo');