class="active" em landing page

clickanapolis · Outubro 30, 2018

Boa tarde pessoal.

Criei uma landing page com os menus no topo e ao clicar no meu ele direciona para a div.

É coloquei no Inicio assim:

para ficar destacado.

Só que o cliente me pediu para que toda vez que clicar em uma div ele ativa o menu atual.

Como eu faria isso em uma landing page faço nem ideia.

wanderval · Outubro 31, 2018

acredito que seria parecido com isso:

HTML:

<ul class="nav">
  <li class="active"><a href="index.php">Home</a></li>
  <li><a href="about.php">About</a></li>
  <li><a href="contact.php">Contact</a></li>
</ul>

JS:

function setActiveLink(url) {
  var href = url || window.location.href ;
  removeClass();
  
  $('.nav a').each(function(e,i) {
    if (href.indexOf($(this).attr('href')) >= 0) {
      $(this).addClass('active');
    }
  });
}

function removeClass() {
  $('.nav li').removeClass('active');
}


setActiveLink('www.dominio.com.br/about.php');