CSS Slide?? wow! como se hace???

[Lola Lola]

Hola amigos!!

quisiera desarrollar una galeria de fotos como la que aparece en este sitio:

http://www.generalmillsfs.com.ar/default.aspx

Por lo poco que pude ver en el código fuente (no soy programadora sino diseñadora) es una galeria css slide y no un flash. Podrían por favor indicarme como hacerla, o bien de donde puedo descargar el codigo para aplicarla? o algun tutorial, lo que sea? me ha gustado muchisimo, veo que está de moda y me parece bueno aplicarla.

Desde ya GRACIAS como siempre por la colaboración que obtengo de ustedes!!

Saludos!!!

Lola Lola

[Carlangueitor]

Checa esto: http://nivo.dev7studios.com/

Saludos

[pzin]

Lo que hace que se mueva no es CSS sino jQuery, una librería javascript. Puedes buscar por slider jQuery y salen a granel por doquier.

[Lola Lola]

Gracias chicos!

Entonces es jQuery?? uy, se me está complicando... Pensé que podía ser un codigo de css, no tengo idea de JQuery, desconozco si la mecánica es similar a css o es un script que se agrega en el código... podrían decirme por favor como funciona de manera general aplicandolo a un sitio? es un script que lee las fotos de un fichero?? El resto veré si lo aprendo con alguna web...

Gracias!

Lola

[pzin]

Ser ser... Es más bien CSS, pero la chulada la hace jQuery. Pon que es el motor, y CSS la carrocería.

Básicamente la mecánica es como mirar por una ventana desde el sofá de tu casa y ver sólo un trozo del paisaje. Si mueves la cabeza vas viendo otra parte del paisaje.

En CSS se crea esa ventana con un elemento —div o cualquier otro—, pon por ejemplo que tenga una medida 200 píxeles. En el interior de esa ventana iría nuestro paisaje, digamos que tiene cinco partes diferentes, una por cada "vista" —imagen o lo que sea. Entonces como nuestra ventana mide 200 píxeles cada vista tendrá que medir eso. Es decir 200 x 5 = 1000. 1000 es lo que ocuparía todo nuestro paisaje.

Ahora tenemos una ventana de 200 píxeles y dentro de la ventana un elemento de 1000 píxeles que contiene cinco elementos de 200 píxeles cada uno. Para que se "tapen" cuatro elementos y ver siempre sólo uno, nuestra ventana tendrá overflow:hidden.

Lo que hace jQuery, es mover el elemento que mide 1000 píxeles de un lado a otro —con left o right, o incluso top o bottom en uno que sea vertical. En vez de mover la cabeza al tipo que mira por la ventana, jQuery mueve el mundo.