Método sencillo de Expandir | Recoger

Muchas veces nos complicamos la vida sin necesidad me refiero en el tema blog claro está, aunque en el tema personal también ocurre pero eso es otra historia.
No sé la cantidad de formas que hay para expandir y recoger texto, códigos o cualquier contenido, lo cierto que es el tema que más consultas recibe este blog y también que al añadirlo a las plantillas adaptadas los problemas se multiplican.

Hay un script que proporciona J.Miur y me parece la forma más sencilla de ocultar un contenido sin necesidad de hacer grandes cambios en la plantilla. Únicamente es necesario añadir un script justo antes de </head>


<script type='text/JavaScript'>
function verocultar(cual) {
var c=cual.nextSibling;

if(c.style.display=='none') {
c.style.display='block';
} else {

c.style.display='none';
}
return false;
}
</script>

Una vez añadido sólo queda ubicarse en el sitio que vamos a ocultar post, sidebar o cualquier parte, para añadir lo siguiente:

Aquí escribimos el texto visible....
<a onclick="return verocultar(this);"href="javascript:void(0);">[+/-]</a>
<div style="display: none;">Contenido oculto</div>

En contenido oculto podemos incluir cualquier cosa.

Vídeos [+/-]


Imágenes[+/-]


Texto [+/-]
Maecenas pretium, neque vel sodales dapibus, mi lorem congue lorem, quis euismod justo nisi id ipsum. Proin sapien. Aenean sed magna ac ligula tincidunt aliquet. Vestibulum ipsum tellus, ornare sed, cursus nec, luctus at, risus. Aenean vulputate, ligula sed tincidunt pretium, nisi magna ultrices orci, et dapibus leo lectus vel risus. Mauris vulputate scelerisque sem. Quisque quam nibh, malesuada eu, rutrum in, rhoncus id, dolor.


Código[+/-]

<script type='text/JavaScript'>
function verocultar(cual) {
var c=cual.nextSibling;

if(c.style.display=='none') {
c.style.display='block';
} else {

c.style.display='none';
}
return false;
}
</script>


Podemos sustituir el símbolo de expandir recoger por una imagen, lo que haríamos sería añadir <img src="url-de-la-imagen"/> en lugar de [+/-]

Pellentesque pulvinar, tortor viverra facilisis faucibus, augue risus tempus ipsum, vel interdum ante pede nec nisl.
Mauris vitae massa id lorem blandit tempor. Nam lacinia mi eu neque. Donec porttitor feugiat felis. Sed placerat facilisis turpis. Vivamus tempus urna sit amet sapien. In lacinia vulputate lorem.


0 comentarios:

Publicar un comentario