Tutorial HTML, CSS u. PHP - Forum

[Joerch]

Hallo an Alle!
Ich habs dank "html-seminar" endlich hinbekommen, die Lightbox2 in einer von mir betreuten Seite zu aktivieren. Zumindest im IE8. Im Firefox (update ist neu) wird die Seite mit den Thumbs zwar einwandfrei angezeigt, die Links verhalten sich allerdings, als wären sie nicht vorhanden.
Es handelt sich dabei um die Seite http://www.heimatverein-sottrum.de/html/galerie.html
Wer kann einen Fehler im Quellcode finden, der ursächlich für das Versagen der Lightbox 2 im Firefox ist?

[Sarkkan]

Naja.. du scheinst nicht wirklich wert auf Validität zu legen^^

Langform: Man darf um ein Block-Element kein Inline-Element legen.
Kurzum: Es darf nicht

Code: Alles auswählen

<a>
    <td>
        <img />
    </td>
</a>

heißen sondern muss

Code: Alles auswählen

<td>
    <a>
        <img />
    </a>
</td>

heißen (:

[Joerch]

Danke sehr für Deine Antwort! :-) Werde es allerdings erst morgen ausprobieren können. Was mich noch interessieren würde: Warum verzeiht mir der IE8 diese kleinen Fehler und der Firefox nicht?

[Sarkkan]

Ehrlich?
Weil der IE einfach nur ein Drecks-Browser ist?
Eines der schlechtesten Programme, die ich kenne^^

[Joerch]

Habs mir gerade noch mal angesehen und hab ehrlich gesagt immer noch keine Ahnung, wie ich das jetzt korrigieren kann. Die Zeile 2 ist ja von NetObjects Fusion 9 erstellt. In Fusion selbst ist es ja unmöglich solche Links handschriftlich hinzuzufügen. Also hab ich die Seite in scriply importiert und die entsprechenden Sätze dort hinzugefügt. Wie kann ich das jetzt umstricken, damit´s valide ist? Die Thumbs sollen ihre jetztige Position bitte dabei behalten.

...
1 <a href="images/Heimathaus_01.jpg" rel="lightbox[Galerie]" >
2 <td width="178"><img id="Bild3" height="132" width="178" src="images/thumb_Heimathaus_01.jpg" border="0" alt="Heimathaus" title="Heimathaus" ></td>
3 </a>
...

[Sarkkan]

Wie gesagt.. an für sich musst du nur die Links in die Tabellen-Zellen einfügen.. (sollte eignetlich auch die darstellung so belassen, wie es derzeit ist)
Das dein Dingsda des net von selbst macht zeigt, wie toll es ist.. <.<

[Joerch]

Du merkst, dass meine Programmierkenntnisse etwa so toll sind, wie das "dingsda"... ;-))
Was bitte sind die Tabellenzellen?? Kannst Du mir bitte noch mal kurz n Beispiel beamen?

[Sarkkan]

Es soll nicht so aussehen:
1 <a href="images/Heimathaus_01.jpg" rel="lightbox[Galerie]" >
2 <td width="178"><img id="Bild3" height="132" width="178" src="images/thumb_Heimathaus_01.jpg" border="0" alt="Heimathaus" title="Heimathaus" ></td>
3 </a>
sondern so:
1 <td width="178">
2 <a href="images/Heimathaus_01.jpg" rel="lightbox[Galerie]" ><img id="Bild3" height="132" width="178" src="images/thumb_Heimathaus_01.jpg" border="0" alt="Heimathaus" title="Heimathaus" ></a>
3 </td>

[Joerch]

Cool, ok! Vielen Dank Dir noch mal! Wie gesagt, ich probiers morgen gleich aus! Auf bald!

[Joerch]

Hallo Sarkkan, habe Deinen Tipp nun integriert und es funktioniert einwandfrei! Super! Danke!
Vielleicht ist Dir aufgefallen, das ich das Wort "close" in "schliessen" geändert hatte. Durch simples ablegen einer neuen closelabel.gif in das images-Verzeichnis. Wiederum hat der IE8 das einwandfrei verarbeitet und die Box fehlerfrei geöffnet. Der Firefox hat mir aber eine Scrollleiste unten eingebaut, da "schliessen" natürlich länger als "close" ist. Hast Du da vielleicht auch noch eine Idee?

[Sarkkan]

Du musst in der lightbox.css diese Zeile ändern:

Code: Alles auswählen

#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}

Anstelle von width: 66px; musst du die 66 durch die Breite des Bildes ersetzten.

[Joerch]

Super, danke Dir! Bis bald mal...

Jörch