Make item highlighted if referring to the selected menu

Question

Make item highlighted if referring to the selected menu

Navigation

#1 by (2 votes)
#2 by (0 votes)

2

I have the following code

<div class="produtosMenuItens">
    <div class="produtosMenuItensTit bs">Residencial</div>
    <ul class="produtosMenuItensDiplay" style="display: block;">
        <li class="produtosMenuItensLista">ITEM 1</li>
        <li class="produtosMenuItensLista">ITEM 2</li>
    </ul>
</div>
<div class="produtosMenuItensTit">Industrial</div>
<ul class="produtosMenuItensDiplay" style="display: none;">
    <li class="produtosMenuItensLista">ITEM 3</li>
    <li class="produtosMenuItensLista">ITEM 4</li>
</ul>
</div>

Next, there are two menus, when I select ITEM 1, and enter the page in question, I want it to be highlighted, can be adding a class via Jquery, how do I do this?

Jquery looks like this:

$(".produtosMenuItensTit").click(function() {
    if($(this).parent().find(".produtosMenuItensDiplay").css('display') == 'none'){
        $(".produtosMenuItensDiplay").css('display','none');
        $(this).parent().find(".produtosMenuItensDiplay").show();
    }
    else{
        $(this).parent().find(".produtosMenuItensDiplay").hide();
    }
});

html jquery

asked by anonymous 21.05.2014 / 18:21

2 answers

Best way to pass data to all MVC Controllers [closed] How to extract blob files in firebird?

score 2 · Answer 1

I did it!

JQUERY

$("[pagina]").each(function(index,element){
   var link = $(element).attr('pagina');
      if(menu.split(link).length>1){
        $(element).css({'color':'#0093C9','font-weight':'bold'});
}

HTML

<li pagina="paginaSYS" class="produtosMenuItensLista">BLABLABLA</li>

score 0 · Answer 2

If I understand you correctly, you can add a class to highlight the clicked element, eg

CSS

 .active {background-color:red;}

JQuery

$('.produtosMenuItensLista').click(function(){
    //remove class active
    $('.produtosMenuItensLista').removeClass('active');
    //adiciona class active ao item clicado
    $(this).addClass('active');
});

JSFiddle