Gernot Back: horizanteles Scrollen auf einen Bereich beschränken

Beitrag lesen

Hallo rainbowmonkey,

Zur verdeutlichung ist hier die Skizze zu finden:
http://www.three-tourist-treasure.de/print.php

Meine Frage ist nun, wie ich es schaffe das horizontale Scrollen lediglich auf die Bilderreihe zu beschränken und die linke Informationsspalte immer sichtbar erhalten kann.

Du müsstest da mit zwei verschachtelten Containern um deine Bilder arbeiten, die in einer Zeile dargestellt werden sollen. Die Weite des inneren Containers, der direkt um deine Bilder herum liegt, setzt du auf die Gesamtweite aller deiner Bilder in der Zeile, sodass sie alle ohne Umbruch nebeneinander passen. Wie viele Bilder du insgesamt in einer Zeile hast und wie breit die sind, das kannst du ja client- oder serverseitig auslesen.

Mit Javascript habe ich unlängst etwas Ähnliches auf dieser Testseite gemacht:

http://lernspielwiese.de/scroll/horizontalscrollanchor.html

Dem äußeren Container gibst du eine Weite und overflow:auto. Wie breit der äußere Container sein muss, damit er zusammen mit der feststehenden linken Spalte beim Client das ganze Fenster ausfüllt, das kannst du natürlich nur cleintseitig mit JavaScript auslesen.

Wie deine Seite im Moment funktioniert, ist mir allerdings auch schleierhaft: Du hast zwei ineinander verschachtelte BODY-Elemente. Das ist absolut invalide. Was die Browser da anzeigen, ist reine Glücksache.

Gruß Gernot