Éste código es de los que más me gustan además de que lo considero muy útil para determinados casos.
Se trata de un código que permite haciendo click en una imágen o texto expandir una parte que permanece oculta, ya sea para que el post no sea demasiado largo o porque no queramos que todo esté a la vista.
Puede usarse para listas de links en nuestro sidebar, o para otros usos.
Click en la siguiente imagen para ver un ejemplo implantado en MALINA MANIAC.
| 18,327 |
| 18,324 |
| 18,324 |
| 18,324 |
| 18,324 |
| 17,655 |
| 18,324 |
| 18,324 |
| 17,654 |
| 17,654 |
Ver otro ejemplo dentro de un post
Aquí la explicación del codigo:
Consta de 2 partes, la primera para debe ser colocada en la plantilla (sólo será necesario una vez). La segunda parte la colocaremos en cualquier entrada o elemento html donde lo queramos implantar.
EN LA PLANTILLA: antes de </head>:
<style type="text/css">.texthidden {display:inline}.shown {display:block}</style><script type="text/javascript">document.write('<style>.texthidden {display:none} </style>');</script><script type="text/Javascript">function expandcollapse (postid) {whichpost = document.getElementById(postid);if (whichpost.className=="shown") {whichpost.className="texthidden";}else {whichpost.className="shown";}}</script> |
EN LA ENTRADA O ELEMENTO HTML:
|
<div style="text-align: left;"> <a href="javascript:void(0);" onclick="expandcollapse('NOMBRE UNICO')"> <img src="URL IMAGEN" /></a> </div> <div id="MISMO NOMBRE UNICO" class="texthidden">
ENTRE ESTAS ETIQUETAS DIV COLOCAR TODO EL HTML DE LO QUE PERMANECERÁ OCULTO. </div>
|
Visto en :: lablogueria
1 comentarios:
Muchas gracias.. excelente codigo
Publicar un comentario en la entrada
Hola, por favor se amable, deja tu nombre y si necesitas respuesta suscribete al comentario ya que te responderé aquí mismo.
@>-,´-: MaLiNa