Hallo,

ich versuche gerade Bilder die als Thumbnails dargestellt werden, zusammen mit Text, als Platzhalter für Galerien bündig zusammen zu fassen.

http://triggertrix.com/nextgen/

Allerdings bekomme ich das egal was ich tue nicht hin.

Also Ziel soll sein, -sofern möglich- ein Thumnail mit einer Bildunterschrift (derzeit h1), nebenan einen kleinen Beschreibungstext. Alle drei Elemente (Bild, h1, text) sollen in einen grauen Kasten gesetzt werden, so das sie optisch als Einheit wirken.

Wie gesagt, durch das JS bekomme ich das aber nicht anders gelöst, kann mir da jemand weiter helfen?

Dank & Gruss

P.S. Nein die Seite bleibt nicht so dilettantisch, ist nur um mir das optisch einfach zu machen, erst muss ich o.g. Problem lösen…

weiss denn wirklich keiner was?

Tut mir Leid, aber kannst Du das irgendwie anders erklären? Ich versteh nicht genau was Du meinst. Welche Bündigkeiten sind gesucht, die sollten ja immer relativ zu etwas sein, aber Du schreibst nirgends was sich woran ausrichten sollte. Oder ich verstehs einfach nicht
^^

Dein Code ist halt sehr unübersichtlich :-) Zuerst mal: ein div darf auf einer Seite nur 1x erscheinen. Hier heissen alle divs "album".
Ich würde pro Thumbnail eine Box (div) erstellen, alle unterschiedlich benennen, position: absolute, Abstände links und oben definieren, Breite und Höhe definieren, mit grau oder der Farbe deiner Wahl hinterlegen. In diese Boxen die Bilder packen (class: float left, padding right ca. 20px), dann einfach h1 und bodytext reinsetzen (ohne span, braucht es nicht).
Hoffe es klappt, Grüsse - Designerist

Zitat

Zuerst mal: ein div darf auf einer Seite nur 1x erscheinen. Hier heissen alle divs "album".

Das kommt daher, das sich das Javascript jeden Bilderordner nimmt (der eingepackt in das DIV Album da liegt) und alle, bis auf das erste Bild versteckt. Die sichtbaren, skaliere ich auf Thumbnailgrösse.

Zitat

Ich würde pro Thumbnail eine Box (div) erstellen, alle unterschiedlich benennen

Ehrlich gesagt habe ich das noch nicht versucht, denke aber (da ja JS das rauswirft) wird das nicht funktionieren.
EDIT: Ok, habe ich gerade versucht, gute Idee funktioniert aber nicht

Zitat

Tut mir Leid, aber kannst Du das irgendwie anders erklären?

Klar,
also ich habe die Thumbnails, unter(von mir aus auch drüber) den Thumbs soll einfach eine mit h1 deklarierter Name sein (Galeriename, hier "Badespass"), direkt neben jedem einzelnen Thumb soll ein kleiner Beschreibungstext stehen.
Und alle drei Elemente, Tumb, Überschrift und Beschreibungstext, sollen zusammen gehören.

Sprich Galeriethumb 1 und Überschrift 1 und Beschreibungstext 1, dann das nächste 2+2+2 usw. also dass das jeweils eine "Gruppe" ist.
Derzeit ist ja Bild 3 und Text3 getrennt, was eben niocht passieren soll.

Wenn das schon mal zu lösen ist würde ich gerne um die jeweiligen Gruppen immer einen grauen Kasten legen, so dass das optisch auch als Gruppe wirkt. Die repräsentieren ja jeweils eine Galerie, daher die klare Trennung voneinander.

So klarer?

Dank & Gruss

Hm…… das Forum lässt mich nicht länger Editieren……
also dann halt so:

P.S. EDIT II : mir ist noch nicht ganz klar ob es ein Schritt nach vorne oder nur noch mehr verwirrung in meinem Code ist,

aber ich habe das Span Element auf das Image ausgedehnt und siehe da, ich habe fast mein Ergebnis, jetzt muss ich nur noch die Überschrift zur solchen machen (also das sie nicht daneben steht) und den Kasten ausrichten das der Inhalt zentriert ist, dann müste ich es haben, oder? Wisst ihr noch etwas besseres?

Jetzt sieht es doch schon ganz gut aus!
Grüsse, Designerist

Das stimmt, und Du bist dran Schuld! ;o)
Durch Deinen Hinweis mit den einzelnen Div´s kam ich auf die Idee, das Span auszuweiten…

allerdings klebt das Bild jetzt unten am Rand, die Überschrift steht nebenan (gut gibt schlimmeres) und alle Attribute die ich den Bildern mitgegeben hatte (abgerundete Ecken usw.) sind weg……
Das heisst es ist optisch ein wenig besser, aber das worauf es mir ankommt, Kontrolle über alle drei Elemente der jeweiligen Galerie zu haben, hab ich noch nicht erreicht……

Jetzt halt noch eine class im CSS schreiben, welche die Attribute des Images enthält und dann dem img diese class zuweisen. Das Bild klebt unten, weil es sich an padding 1em vom div hält. Gib doch mal der class des img margin-top: -10px. Ev. funkt das.
Grüsse, Designerist

Hmpf…… ich hatte einen Fehler gemacht, Du hattest Recht (weiterhin ;o) ) Ich hatte nur Class mit ID verwechselt und dann passiert da natürlich nicht so viel.

Allerdings ärgert mich jetzt das Javascript auf der Seite, da es regulär ja bis auf das erste Bild, alle anderen des jeweiligen Albums versteckt, diese Funktion wird durch das "packen in ein Div" irgendwie blockiert und mir klastert es die gesamte Seite voll…

Hoppla - das verstehe ich jetzt nicht. Ich kenne mich nur mit Lightbox2 aus für Bildergalerien. http://lokeshdhakar.com/projects/lightbox2/

Hm…

ist nur ne Hypothese, ich kenne mich auch nicht aus damit, geschrieben hat das ein lieber Mensch für mich.
Ich weiss ja nicht ob sich Javascript so leicht irritieren lässt, ich habe aber ansonsten keine Erklärung dafür…

Da kann dir sicher der helfen, der den Script geschrieben hat. Das würde ich nicht selber heraustüfteln - lieber den Programmierer fragen :-)

Antwort auf [ Designerist ]

ein div darf auf einer Seite nur 1x erscheinen. Hier heissen alle divs "album".

Das ist Quatsch. Man kann DIVs + Klassen beliebig oft verwenden. Was du meinst, sind unique identifiers - also <div id="foo"></div>. Bei <div class="foo"></div> ist das nicht der Fall.

@Turbohonk: schau dir mal die sogenannten "masonry" Techniken an, vielleicht wirst du hier fündig? http://designshack.net/articles/css/masonry/