Ir para conteúdo

POWERED BY:

Arquivado

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

itamarsilvacc

Botão que alterna a exibição de dois coteúdos

Recommended Posts

Boa noite galera, alguém poderia me explicar como faço um botão como o deste site ( http://www.paieterno.com.br/site/oracao/velas-da-fe/ ) que quando é clicado, esconde as velas que estão acesas, ou seja, o bloco de conteúdo onde elas estão, e exibe um bloco de conteúdo com um formulário para acender uma vela, e troca o seu texto de Acender Vela para Exibir vela, se no estado Exibir Velas o botão for clicado, o bloco com o formulário é escondido novamente e o bloco com as velas exibido. Grato...

Compartilhar este post


Link para o post
Compartilhar em outros sites

bom amigo esse tipo de efeito é feito com a propiedade display sendo display:none usado para que o elemento não fique visivel e deiche de ocupar o espaço que ocupa estando visivel e apropiedade display:block sendo utilizado para o inverso da propiedade display:none, bom o jquery tem uma função chamada toggle que tem como armazenar o estado anterior

 

um exemplo que fiz utilizando a função toggle.

 

http://jsfiddle.net/29Lpgmzx/

 

bom fiz utilizando toggle e não com display devido a possibilidade de callback e possiveis animações caso não fique a vontade com a solução coloco outro exemplo. sobre o site seria o mesmo que

 

ter 2 divs uma que engloba todas as velas já cadastradas, tendo o formulario com o estado display:none, quando você clica no botao é verificado qual div/elemento está ativo tornando o atual ativado invisivel e o atual desativado visivel

 

espero ter ajudado, espero que tenha entendido o conceito do efeito.

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.