Ir para conteúdo

POWERED BY:

Arquivado

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

Odair - Oliveira

Função para alterar ícone

Recommended Posts

Bom dia!

Estou fazendo um site que terá alguns artigos, desenvolvi um um esquema simples que mostra o título do artigo e quando a pessoa clica no ícone mostra o resto do texto e ficou assim: http://chiptronic.com.br/testes/artigos/icones.html

 

Criei esse pequeno script para fazer essa função de mostrar/esconder e alterar o ícone

//ocultar/mostrar div   function mostrarDiv(divid){   if(document.getElementById(divid).style.display == 'none'){   document.getElementById(divid).style.display = 'block';   document.getElementById("icon").style.background = 'url(plus.png)'; //icone '+'   }else{   document.getElementById(divid).style.display = 'none';   document.getElementById("icon").style.background = 'url(minus.png)'; //icone '-'   }   } 

 

Tem um pequeno problema nesse script, ele funciona bem mas quando eu coloco dois artigos ao invés dele trocar o ícone do artigo que foi clicado ele troca o ícone de apenas um e fica assim:

http://chiptronic.com.br/testes/artigos/icones-2.html

 

O que eu devo fazer para conseguir alterar apenas o ícone da div que foi clicada?

Compartilhar este post


Link para o post
Compartilhar em outros sites

aqui:

	   document.getElementById("icon").style.background = 'url(plus.png)';	//icone '+'
em vez de trabalhar com esse ID fixo, vc tem q pegar o elemento do icone apartir do objeto clicado.

 

estude sobre o this do javascript.

Compartilhar este post


Link para o post
Compartilhar em outros sites

 

aqui:

	   document.getElementById("icon").style.background = 'url(plus.png)';	//icone '+'
em vez de trabalhar com esse ID fixo, vc tem q pegar o elemento do icone apartir do objeto clicado.

 

estude sobre o this do javascript.

 

Consegui resolver fazendo o seguinte:

 

 

 

function mudar(divid){
if(document.getElementById(divid).style.backgroundImage == 'url(img/plus.png)'){
  document.getElementById(divid).style.backgroundImage = 'url(img/minus.png)';
}else{
  document.getElementById(divid).style.backgroundImage = 'url(img/plus.png)';
}}

 

<div id="apresentacao" class="subtitulo" onClick="togle('texto-apresentacao');mudar('icone1');">
            <div id="icone1" class="icone" style="background-image:url(img/plus.png);"></div> <h2>Apresentação</h2>
</div>

 

Não é o certo, mas resolveu meu problema por enquanto...

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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