Cómo poner un botón "spoiler" en el blog


Bueno ya todos saben que es un spoiler, pero para los que no saben, entonces un spoiler es una herramienta un botón para mostrar o ocultar cualquier contenido para ahorrar espacio para colocarlo en los posts, es fácil colocar, no es nada de modificar nada extravagante en la plantilla, hay dos maneras diferentes para colocarlo:
  • En forma de Link:
<div><a href='#' onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.innerHTML = 'Ocultar Contenido';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.innerHTML = 'Mostrar Contenido';}return false" type="button">Mostrar Contenido</a><div style="display: none;">AQUI EL CONTENIDO QUE QUIERAS OCULTAR</div></div>
Asi quedaría:

  • En forma de Botón:
<div><input value="Mostrar" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar Contenido';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Mostrar Contenido';}" type="button" /><div style="display: none;">AQUI EL CONTENIDO QUE QUIERAS OCULTAR</div></div>
Asi quedaría:


Related Posts Plugin for WordPress, Blogger...