JavaScript: Destacar item do menu ao clicar (cor de fundo)
Este post tem uma pequena alteração em relação a outro já publicado.
O item de menu que ficará em destaque, terá a cor de fundo e a cor de fonte alterada.
<html> <head> <script> function mostrarAtivo(tag){ var tag_li = document.getElementById('lista_menu'); var tag_a = tag_li.getElementsByTagName('a'); for (i=0; i<tag_a.length; i++ ){ tag_a[i].style.backgroundColor = ""; tag_a[i].style.color = ""; } tag.style.backgroundColor = "#ff0000"; // altera o fundo tag.style.color = "#ffffff"; // altera a cor } </script> </head> <body> <ul id="lista_menu"> <li><a href="#" onclick="mostrarAtivo(this);">Home</a></li> <li><a href="#" onclick="mostrarAtivo(this);">Fotos</a></li> <li><a href="#" onclick="mostrarAtivo(this);">Agenda</a></li> <li><a href="#" onclick="mostrarAtivo(this);">Contato</a></li> </ul> </body> </html> |
Gostaria de saber como faço para puxar a imagens no lugar de numero exadecimal??
ficando assim??
}
tag.style.backgroundColor = “#ff0000 imagens/menu_ativo.png”; // altera o fundo
tag.style.color = “#ffffff”; // altera a cor
}
Olá Adriano.
Faça assim:
tag.style.backgroundImage=”url(‘imagens/menu_ativo.png’)”;
Olá, estou usando este código com backgroundImage como no comentário do Tiago. Mas como faço um menu onde posso selecionar a imagem que irá substituir no backgroundImage?
http://jsfiddle.net/ey8mxj6t/8/
Grato!!
Thiago, Boa noite!!
Como faço para o menu abaixo mudar de cor quando clicado?
CSS.ESTILOS
.menu {
z-index:2;
width:1000px;
height:80px;
display:inline;
float:right;
margin-left:auto;
margin-top:20px;
position:relative;
text-align:center;
background-color:#F4FFFF;
}
.BarraMenu a {
font-family:Tahoma, Geneva, sans-serif;
font-size:18px;
color:#004080;
text-decoration: none;
text-align: center;
padding: 8px;
}
.BarraMenu a:hover {
color:#F00;
}
Home
Quem Somos
Notícias
Localização
Contato
Olá Tiago,
Tentei usar o código acima “destacar item de menu”, usando a tag tr e a td, para fazer funcionar em uma lista de clientes usando o button na linha da lista da , mas não deu certo.
Tem como colocar um exemplo, fazendo um favor.