JavaScript Galerie

Zur Demonstration über das Resultat der zu entwickelnden Galerie haben wir ein Design angehängt.

Wie im Design ersichtlich soll die Photogalerie aus einem

- Scroller bestehen (die Anzahl der gezeigten Thumbnails muss administrierbar sein)

- links und rechts am Ende des Scrollers muss ein Fade Out erstellt werden

- das aktive Bild muss in der Thumnailleiste vergrößert dargestellt werden

- der Thumnail links und rechts neben dem aktiven Thumbnail muss vergrößert dargestellt werden, jedoch kleiner sein als der aktive Thumbnail

- Alle Thumnails müssen eine Reflektion nach unten haben. Egal welche Hintergrundfarbe, schwarz, weiß, farbig, die Reflektion muss immer sauber dargestellt werden.

- Das aktive Bild muss in Großansicht in einem definierten DIV-Container oder ein anderes HTML Element mittels ID dargestellt werden. Wie im Design ersichtlich muss der Galerie Scroller über dem Großansichts-Container liegen

- Bildformate jpg, gif, png

- Das Ganze soll auf JQuery basieren

Definitionsmöglichkeiten:

- Anzahl Thumbs in der Scrollbar

- optionales Ein-/Ausblenden von Navigationspfeilen links und rechts von der Scrollbar

- Darstellung der Großansicht hinter der Scrollbar, oder über der Scrollbar oder an einer beliebig anderen Position

- Bewegung der Scrollbar wahlweise onClick oder onOver

- Optionales Ein-/Ausbelnden der Metatags eines Bildes in einem definierten DIV oder ein anderes HTML Element mittels ID

- Definitionsmöglichkeit der Größe der 3 verschiedenen Thumbnails und der Großansicht.

Bilder müssen automatisch auf diese Größe verringert werden.

- Auto scroll und auto display Großansicht optional aktivieren/deaktivieren

- Definition der Scrollgeschwindigkeit

- Definition des Preloading Images

- Definition der optionalen Scroller Navigationspfeile

Das Script muss Crossbrowser kompatibel sein, d.h. mindestens:

- Firefox 3.x, 4.x 5.x

- IE 7.x, 8.x, 9.x

- Google Chrome

- Safari

- Opera

- Netscape

Es muss auch über mobile devices steuerbar sein, zum Beispiel iphone, Blackberry oder sonstige Smartphones (Windows mobile, iOS, Android, Symbian, Blackberry OS)

Für die Reflektion kann auf folgende Funktion zurück gegriffen werden: http://finnrudolph.de/ImageFlow