botão "mostrar" "esconder"

Olá!
hoje estou aqui para ensinar a como colocar um botao "mostrar" "esconder" como no exemplo:


Para colocar um botao como este bata colocar este código nas postagens que você deseja o botao e alterar o que está em vermelho:

    Aqui o texto que vai aparecer e que vem antes do botão...

    <div class="pre-spoiler">

    <input id="xs" value="Leia Mais" style="margin-left: 50px; padding: 0px; width: 80px; " onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Ocultar'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Leia Mais';}" type="button"> </div>

    <div>

    <div class="spoiler" style="display: none;">

    Aqui você coloca o texto que quer esconder e que só vai aparecer quando clicarem no botão.

    </div>

    </div>

    E aqui a continuidade do texto do seu artigo que aparece abaixo do botão e continua mesmo depois que clicam para ver o trecho escondido.

espero ter ajudado.

1 comentários:

junior disse...

Obrigado por compartilhar o conhecimento acesse meu web site

www.loweergames.co.cc

Related Posts with Thumbnails