Cosillas de la semana
Como han podido apreciar la categoría de Cosillas de la semana ha desaparecido. La he quitado porque no me gustaba como estaba organizada... estaba todo muy desordenado. Ahora pueden acceder a las cosillas de la semana (recomendaciones que hago cada semana) desde el menú que está debajo de la cabecera.
He reunido todas las recomendaciones es una página quitando los videos y las imágenes ya que no eran cosas muy personales pero las canciones, los álbumes, las películas y las frases sí.
Nada más entrar en Cosillas se encontrarán con algo como esto:
Si pinchas en los menus se van desplegando las distintas opciones: álbumes, películas... Está programado en JavaScript usando una función muy sencilla que permite mostrar y ocultar capas:
< script LANGUAGE="javascript">
function cambio(idCapa) { if (document.getElementById(idCapa).style.display == "none") document.getElementById(idCapa).style.display = "block"; else document.getElementById(idCapa).style.display = "none"; } < /script>Mira si la capa está oculta y la muestra, en caso contrario la oculta.
Para las películas y los álbumes he usado una serie de funciones y efectos JavaScript recogidos bajo el nombre de LightBox. Al pinchar en una película o un álbum se despliega de esta forma (siempre que tengas la página totalmente cargada):
Alucinante, ¿verdad?. Pues si subes el ratón a la esquina derecha te saldrá un botón para pasar a la siguiente y en la esquina izquierda para ir a la anterior. ¿Cómo lo he hecho? Pues así:
1. Lo primero es descargar el LightBox JS v2.0
2. En la página que vayamos a usar estos efectos incluimos:
< script type="text/javascript" xsrc="js/prototype.js" mce_src="js/prototype.js" > < /script> < script type="text/javascript" xsrc="js/scriptaculous.js?load=effects" mce_src="js/scriptaculous.js?load=effects" > < /script> < script type="text/javascript" xsrc="js/lightbox.js" mce_src="js/lightbox.js" > < /script>y el CSS:
< link rel="stylesheet" xhref="css/lightbox.css" mce_href="css/lightbox.css" type="text/css" media="screen" />3. Ahora en cada link que queramos que tenga ese efecto lo ponemos de esta forma:
< a xhref="images/image-1.jpg" rel="lightbox" title="titulo">image #1< /a>
4. ¡LISTO! El paquete con todas las funciones JavaScript deberá estar en la misma carpeta que la página con los efectos o al incluirlo poner la ruta.
Hay varias opciones adicionales como juntar imágenes por grupos (para que puedan pasar a la siguiente o a la anterior). Esto se hace poniéndo dentro del rel="imagen1[pelicula]". De esta forma todos los que lleven la coletilla [pelicula] estarán en el mismo grupo.
Para saber más cosas visiten esta web.
NOTA: para los que usen WordPress hay un plugin de LightBox JS!
0 Respuestas a “Mejoras en PisitoenMadrid”