Vamos a aprender hoy con un simple código como podemos poner en nuestras entradas un texto largo y poder ocultarlo fácilmente.
Para ello nos vamos a nuestras entradas y en la edición HTML, ponemos este código y cambiamos lo marcado en rosa por el texto que queramos ocultar.
Quedará de la siguiente forma:
Mostrar / Ocultar ▼▲
Para ello nos vamos a nuestras entradas y en la edición HTML, ponemos este código y cambiamos lo marcado en rosa por el texto que queramos ocultar.
Quedará de la siguiente forma:
<div
class="divspoiler"> <ahref="javascript:void(0);" onclick="if
(this.parentNode.nextSibling.childNodes[0].style.display != '') {
this.parentNode.nextSibling.childNodes[0].style.display = ''; } else {
this.parentNode.nextSibling.childNodes[0].style.display = 'none';}"
>Mostrar / Ocultar ▼▲</a>
</div><div><div
class="spoiler" style="display: none;">
Aquí el contenido que queremos ocultar </div></div>
class="divspoiler"> <ahref="javascript:void(0);" onclick="if
(this.parentNode.nextSibling.childNodes[0].style.display != '') {
this.parentNode.nextSibling.childNodes[0].style.display = ''; } else {
this.parentNode.nextSibling.childNodes[0].style.display = 'none';}"
>Mostrar / Ocultar ▼▲</a>
</div><div><div
class="spoiler" style="display: none;">
Aquí el contenido que queremos ocultar </div></div>
Ahora bien si lo que queremos es mostrar un botón o otro tipo de imágen este será el código:
<divclass="divspoiler"><imgsrc="URL de la imagen" onclick="if
(this.parentNode.nextSibling.childNodes[0].style.display != '') {
this.parentNode.nextSibling.childNodes[0].style.display = ''; } else {
this.parentNode.nextSibling.childNodes[0].style.display = 'none';}" />
</div><div><div
class="spoiler" style="display: none;">
Aquí el contenido que queremos ocultar
</div></div>
(this.parentNode.nextSibling.childNodes[0].style.display != '') {
this.parentNode.nextSibling.childNodes[0].style.display = ''; } else {
this.parentNode.nextSibling.childNodes[0].style.display = 'none';}" />
</div><div><div
class="spoiler" style="display: none;">
Aquí el contenido que queremos ocultar
</div></div>
Ahora cambiamos lo marcado en azul por la url de nuestra imagen, y lo rosa por la contenido que queremos ocultar.
Se verá de la siguiente forma.
No hay comentarios:
Publicar un comentario
Deja tu comentario y en breve te contestaremos