Enlace spoiler en blogger

El enlace Spoiler, es un enlace que al hacer click en él, sobresale un texto o lo que sea por debajo y al hacer click en el mismo enlace luego, cierra todo el contenido.

Insertar un enlace Spoiler

Este enlace se puede agregar tanto en una entrada como en un gadget y además se pueden agregar varios a la vez.
Para mostrarles cómo queda un enlace spoiler observen este enlace:

Abrir[+]

Este es el contenido del spoiler.

El código es:

<div><a href="#" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.innerHTML = 'Cerrar[-]';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.innerHTML = 'Abrir[+]';}return false" title="teoriablogger.blogspot.com" type="button">Abrir[+]</a><div style="display: none;">Este es el contenido del spoiler.</div></div>

Para modificar el spoiler, haz lo siguiente:
Lo que está marcado en rojo, es la palabra que cerraría el spoiler cuando esta abierto.
Lo que esta marcado en violeta, son las palabras que van cuando el spoiler esta cerrado.
Y lo que esta en verde, es la frase o el contenido del spoiler.
En el contenido puedes poner lo que quieras: enlaces, elementos flash, y más.

¿Y en forma de botón?

En forma de botón tiene la misma función y quedaría así:
Lo puedes hacer en forma de botón:

Este es el contenido del spoiler.

El código es:

<div><input value="Abrir[+]" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Cerrar[-]';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Abrir[+]';}" type="button"><div style="display: none;">Este es el contenido del spoiler.</div></div>

Y a los textos los modificas como al modo enlace spoiler.

Posteado en: Botón,Códigos HTML,Curiosidades,Enlace,Intermedio