Jacqueline mit 4 Jahren
Unter dem Bild ist auch noch Text.
Andreas' skalierbare Sliding Doors-Box

Die Box wurde mit einer Breite von 50% definiert. Durch Änderung der Fensterbreite wird die Box mit in der Breite skaliert. Nach unten wächst die Box mit ihrem Inhalt. In beiden Richtungen skalieren die Boxen natürlich nur so lange, wie die Graphiken für den Rahmen breit bzw. hoch sind. Sind die Maßen überschritten, erhält man eine Sieb-Box ;)

Links oben sind ein paar Pixel der rechten Rahmen-Graphik zu sehen: Dies ist dadurch bedingt, dass die linke Graphik an dieser Stelle transparent ist.

Aus diesem Grund wurde diese Lösung für die Eiboxen verworfen. Bei der zuvor vorgestellten Eibox erhält der rechte DIV-Bereich eine feste Breite und ist somit keine richtige »Sliding Door«. Bei Eiboxen, die ein Bild enthalten, wird die Breite des rechten DIV-Bereich mittels JavaScript demensprechend angepaßt. Text-Eiboxen haben eine feste Breite von 360px.

Sieb-Box

Diese zweite Box wurde mit einer Breite von 85% und einer Höhe von 800px definiert. Ihr einziger Zweck ist zu zeigen (maximiertes Fenster vorausgesetzt), wie breit die rechte Grafik in der rechten "Schiebetür" in Wirklichkeit ist. Auch die Höhe der Grafik für den rechten Rahmen (ca 700px) ist hier sichtbar.