Esta es la dirección de mi página.
http://projectabc.zz.mu/
Dentro de la página, en la sección de Equipamento se puede ver una galerá de imágenes de los rack de «mi empresa». El código fué extraído de ésta página.
Lo ideal es copiar el siguiente script justo después de <body>:
<script type=»text/javascript»>
$(function() {
$(«div#makeMeScrollable»).smoothDivScroll();
});
</script>
Tras ello, podemos incluír el script de la galería en sí en el lugar que queramos:
<div id=»makeMeScrollable»>
<div></div>
<div></div>
<div>
<div>
<img src=»images/demo/image_1.jpg» width=»400″ height=»200″ />
<img src=»images/demo/image_2.jpg» width=»350″ height=»200″ />
<img src=»images/demo/image_3.jpg» width=»545″ height=»200″ />
<img src=»images/demo/image_4.jpg» width=»400″ height=»200″ />
<img src=»images/demo/image_5.jpg» width=»600″ height=»200″ />
</div>
</div>
</div>
Y ahora una explicación breve del script:
<img src=»images/demo/image_1.jpg» width=»400″ height=»200″ />
En cada una de estas líneas modificamos el código para que en vez de «image_1.jpg» poner la ruta de nuestra imágen en «width» y «height» ponemos la anchura y altura deseados de la imagen y así sucesivamente.
Para una mayor personalización de la galería ir a la página oficial.
El reto de la página fue creada a partir de la plantilla facilitada por el Web Buider, y posteriormente personalizada con el mismo.