Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Gilberto Jr

Trocar imagem no menu expandivel

Por , em Javascript

Recommended Posts

Gilberto Jr    26

Gilberto Jr
Postado

boa noite pessoal, eu estou fazadendo um menu expandivel,

como vcs podem ver no linkMenu Expandivel,

quando o internauta entrar no site ele vem com uma imagem de uma pasta com o sinal de + Imagem Postada e quando a pessoa clicar para expandir eu quero que fique com a imagem da pasta com o sinal de - Imagem Postada e quando o internauta clicar para ocultar novamente ele voltar para imagem Imagem Postada.

 

Teria como vcs me darem uma força?

abaixo segue o codigo da minha pagina.

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
   <title>Menu Expandivel</title>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type='text/javascript'>
document.write('<style>.texthidden {display:none} </style>');

</script><script type='text/Javascript'>
function expandcollapse (postid) {whichpost = document.getElementById(postid);if (whichpost.className=="shown") {whichpost.className="texthidden";}else {whichpost.className="shown";}}
</script>
</head>
<body>
<a href="javascript:void(0);" onClick="expandcollapse('favoritos')"><img border="0" src="
img/col_1.gif"/>Teste 1</a><br/>
<ul id="favoritos" class="texthidden">
<li><a href="http://endereço.com/" target="_blank"><img src="img/page.gif" border="0">Texto 1</a></li>
<li><a href="http://endereço.com/" target="_blank"><img src="img/page.gif" border="0">Texto 2</a></li>
<li><a href="http://endereço.com/" target="_blank"><img src="img/page.gif" border="0">Texto 3</a></li>
<li><a href="http://endereço.com/" target="_blank"><img src="img/page.gif" border="0">Texto 4</a></li>
 </ul>
</body>
</html>

Desde ja eu agradeço

Compartilhar este post

Link para o post
Compartilhar em outros sites

Henrique Barcelos    290

Henrique Barcelos
Postado

Sabe utilizar alguma biblioteca?

 

Com jQuery fica moleza:

$(function(){
 	$('#favoritos ul li').toggle(function(){
 	$(this).css('background-image', 'expandido.gif');
 	}, function(){
 	$(this).css('background-image', 'recolhido.gif');
 	});
});

Adapte para o seu caso... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito