BASE4U

Ich darf euch heute die offizielle Simple Base Gallery vorstellen, die ich erstellt habe. Die Simple Base Gallery ist ein JQuery PlugIn welches jeder gerne verwenden kann.

Was wird benötigt?

1. JQuery
2. JQuery UI (Für die Dialoge)
3. Image Resizer PlugIn von Grizzly

Was kann die Gallery?

Die Gallery zeigt die innerhalb eines Bestimmten HTML-Objektes befindlichen IMG-Tags (also die Bilder) in einer Slider-Gallery an. Dabei kann man die Bilder entweder einfach "nur so" anschauen, also erstes Bild, nächstes Bild, nächstes Bild, vorheriges Bild usw. Oder beim Klick auf ein Bild das Bild in einem JQuery UI Standart Dialog anzeigen lassen, welches dann größer angezeigt wird. Die Bilder werden mit dem von mir erstellten imageResizer skaliert.

Die eigenschaften des Dialogs (Breite, Höhe, Größe änderbar, verschiebbar, modal) können ganz einfach über dir SBGallery Optionen verändert werden.

Wenn sich die Gallery (bzw. der HTML-Element) an der Breite ändert (z. B. in der CSS-Datei) dann werden die Bilder auch automatisch an die Box angepasst.

Wie kann ich die Galerie erstellen?

Da die Galerie ein JQuery PlugIn ist, ist es ganz leicht eine Galerie zu erstellen. Folgender Code wird dazu benötigt:



Welche Optionen können geändert/bestimmt/übergeben werden?

Folgende Optionen stehen zur verfügung:

• dialogWidth: Die Breite des Dialoges. Je nachdem wie groß der Wert ist, wird auch das Bild (Bildbreite im Dialog) skalliert. (Default: 800)

• dialogHeight: Die Höhe des Dialoges. Je nachdem wie groß der Wert ist, wird auch das Bild (Bildhöhe im Dialog) skalliert. (Default: 600)

• modalDialog: Wenn Wert auf true, dann ist der Dialog modal (Im Hintergrund nichts anklickbar) wenn Wert auf false dann nicht modal. (Default: true)
  

• resizeDialog: Wenn Wert auf true, dann ist der Dialog vom Benutzer skalierbar (größe des Dialogs veränderbar) wenn Wert auf false dann nicht skalierbar. (Default: false)

• draggableDialog: Wenn Wert auf true, dann ist der Dialog vom Benutzer verschiebbar wenn Wert auf false dann nicht verschiebbar. (Default: false)

Kann ich mir die Galerie Live ansehen?

Ja! Ich habe die Galerie auf den Server geladen. Somit kann man eine Demo sehen. Es ist auch leichter alles anzuschauen, als sich den gesamten Text durchzulesen. Hier ist der Link:




Wo kann ich mir die Gallery runterladen?

Die Simple Base Gallery kann man sich im Download-Center von Base4u runterladen, oder einfach den folgenden Link klicken:

Darf ich vorstellen, die zweite und verbesserte Version von der Simple Base Gallery. Ich habe mich deshalb für "Version 2" entschieden und nicht für 1.1 oder ähnliches, weil die Gallery sich sehr stark geändert hat und auch um einiges verbessert wurde.

In der Version 2 werden nun unter der Galerie kleine Thumbnails angezeigt. So hat man einen Überblick welche Bilder es gibt und man kann jedes Bild explizit anklicken ohne auf die "vor" und "zurück" Buttons zu klicken. Die Thumbnails können auch ausgebelndet werden indem man die optionen showThumbs auf false setzt beim initialisieren der Galerie. Der Dialog passt sich nun selbst an den Inhalt an, somit ist freier/weißer Raum nicht mehr vorhanden. Außerdem kann man nun auch im Dialog die Bilder aus der Galerie komplett anschauen und nicht wie bisher nur das angeklickte Bild. Wenn die Thumbnails nicht ausgeschalten sind, so sind sie auch im Dialog vorhanden.

Außerdem verwendet die Galerie die neue und verbesserte Version des ImageResizers.

Ich habe euch eine Demo hochgeladen wo ihr das ganze anschauen könnt: