ProtoFlow galeria con estilo Coverflow
Nueva galerÃa realizada por Obaid Ahmed con Script.aculo.us y Prototype para mostrar imágenes en forma de Coverflow, aún en un estado bastante prematuro pero que se ve bien, aquà una demo. La instalación es sencilla, primero cargamos las librerÃas necesarias (prototype.js, scriptaculous.js y protoFlow.js) y a continuación inicializamos la galerÃa:
Event.observe(window, 'load', function() {
cf = new ProtoFlow($("protoflow"), {captions: 'protoCaptions'});
});
</script>
El siguiente paso es crear la estructura en html para la galerÃa, indicando las imágenes que usaremos y el titulo de cada una:
<img src="imgs/DSCN0940_91360.jpg"/>
<img src="imgs/stimme_von_oben_187192.jpg"/>
<img src="imgs/Tropfen_1_Kopie_201721.jpg"/>
<img src="imgs/farbraum_012_147508.jpg"/>
<img src="imgs/IMG_4906_199357.jpg"/>
<img src="imgs/Tropfen_1_Kopie_201721.jpg"/>
<img src="imgs/Fries_201253.jpg"/>
<img src="imgs/Fries_201253.jpg"/>
</div>
<ul id="protoCaptions" class="protoCaptions">
<li>Caption 1</li>
<li>Caption 2</li>
<li>Caption 3</li>
<li>Caption 4</li>
<li>Caption 5</li>
<li>Caption 6</li>
<li>Caption 7</li>
<li>Caption 8</li>
</ul>
Enlace: ProtoFlow first preview release… | VÃa: ProtoFlow: Coverflow for Prototype
Posts relacionados
- Material años 60 y 70
- Minishowcase, monta una simple galerÃa de fotos
- Logotypes, galerÃa gigante de logotipos
Sin comentarios
No comments yet.
Leave a comment
