JQuery

JQuery: Destacando um item de menu

Veja neste post uma maneira simples e fácil de destacar um item de menu ao ser clicado.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
a{text-decoration:none;color:#0000FF}
.destaque{color:#FF0000;}	
</style>
<script type="text/javascript" src="js/jquery.js"></script>
<script>
$(document).ready(function(){
   $('#itens li a').click(function(event){
      event.preventDefault();
      $("#itens li").find("a").removeClass('destaque');
      $(this).addClass('destaque');
   });
});
</script>    
</head>
<body>
<div id="itens">
   <ul>	
	<li><a href='#'>Item 1</a></li>
	<li><a href='#'>Item 2</a></li>            
	<li><a href='#'>Item 3</a></li>
	<li><a href='#'>Item 4</a></li>                        
   </ul>	
</div>
</body>
</html>

2 thoughts on “JQuery: Destacando um item de menu

  • Sandro

    Problema é prevenir comportamento padrão do link, quero saber como fazer isso, sem preventDefault.

    Resposta
  • Cristiano Peyrer

    Muito obrigado brother, tenha feito um com “addClass e removeClass”, mais estava poluído d+, muito claro e limpo seu código, vlw parabéns abrçs!

    Resposta

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *