DIV mit Scrollbalken

[Tom656]

Hallo,

ich bastle gerade an einer einfachen Bildergalerie und komme einfach nicht weiter. Ich hoffe jemand von euch kann mir weiterhelfen.
Ich habe folgendes Problem:

Ich habe auf der linken Seite ein div container, der die Vorschaubilder enthält. Diese sind in einer 2 spaltigen Tabelle untereinander angeordnet. Das div hat das attribut:overflow-y:scroll; damit es durch einen Scrollbalken übersichtlich bleibt.
Die einzelnen Bilder sind mit "galerie.php?image=1.jpg" verlinkt.
Im 2. div container rechts daneben werden die Bilder
mit <img src="galerie/bilder/<?php echo $_GET['image']?>" angezeigt.
Das funktioniert auch soweit.

Wenn man ein Bild von unten anklickt und das Bild geladen ist, springt der Scrollbalken automatisch nach oben. Das ist sehr ärgerlich, weil es einige Bilder sind und jemand, der sich die Bilder ansehen möchte schnell die Lust verliert, wenn er jedesmal nach unten scrollen und suchen muss bei welchem Bild er stehengeblieben ist.

Gibt es eine Möglichkeit, dass der Scrollbalken stehenbleibt und nicht jedesmal wieder nach oben springt?

Danke im vorraus

[wahsaga]

hi,

Ich habe auf der linken Seite ein div container, der die Vorschaubilder enthält. Diese sind in einer 2 spaltigen Tabelle untereinander angeordnet.

Warum Tabelle?

Das div hat das attribut:overflow-y:scroll; damit es durch einen Scrollbalken übersichtlich bleibt.

Warum overflow-y?
Warum nicht einfach overflow:auto?

Die einzelnen Bilder sind mit "galerie.php?image=1.jpg" verlinkt.
Im 2. div container rechts daneben werden die Bilder
mit <img src="galerie/bilder/<?php echo $_GET['image']?>" angezeigt.
Das funktioniert auch soweit.

Also wird jedes mal die Seite komplett neu geladen?

Wenn man ein Bild von unten anklickt und das Bild geladen ist, springt der Scrollbalken automatisch nach oben. Das ist sehr ärgerlich, weil es einige Bilder sind und jemand, der sich die Bilder ansehen möchte schnell die Lust verliert, wenn er jedesmal nach unten scrollen und suchen muss bei welchem Bild er stehengeblieben ist.

Gibt es eine Möglichkeit, dass der Scrollbalken stehenbleibt und nicht jedesmal wieder nach oben springt?

Du könntest es mit Ankern versuchen. Aber Anker für scrollbare Elemente unterstützen wohl noch nicht alle Browser.
Andernfalls bleibt höchstens Javascript - aktuelle Scrollposition auslesen (scrollTop), mit übergeben, und auf Folgeseite wieder ansteuern (Zuweisung an scrollTop).

gruß,
wahsaga

[Tom656]

Hi,

Danke für die Antwort. Ich denke auch, dass es daran liegt, dass die Seite jedesmal neu geladen wird, damit die Variable übergeben wird.
Sieht so aus als ob man das mit php nicht lösen kann.
Der Tip mit dem auslesen der aktuellen Scrollposition ist super.Leider kenn ich mich in Javascript nicht wirklich aus aber ich werd mal googeln, ob ich was passendes finde.

gruß
tom

[Tom656]

Ich habe glaub ich was gefunden:

var x,y;
if (self.pageYOffset) // all except Explorer
{
 x = self.pageXOffset;
 y = self.pageYOffset;
}
else if (document.documentElement && document.documentElement.scrollTop)
 // Explorer 6 Strict
{
 x = document.documentElement.scrollLeft;
 y = document.documentElement.scrollTop;
}
else if (document.body) // all other Explorers
{
 x = document.body.scrollLeft;
 y = document.body.scrollTop;
}

Ich weiss nur nicht wo in meinem Dokument dieses Script hinkommt.
Wie kann ich die Variablen übergeben? Und wie kann ich sie wieder einlesen und auf den Scrollbalken festlegen?
Ich bin etwas verwirrt, da ich mich mit Javascript noch nicht beschäftigt habe.

[wahsaga]

hi,

Ich habe glaub ich was gefunden:

Das bezieht sich auf die Scrollposition des Fensters.
Du scrollst aber gar nicht im ganzen Fenster, sondern nur in einem Element mit entsprechender overflow-Angabe.

scrollTop

Wie kann ich die Variablen übergeben? Und wie kann ich sie wieder einlesen und auf den Scrollbalken festlegen?

Übergabe per Cookie, per URL (GET), ... - such dir was aus.

Ich bin etwas verwirrt, da ich mich mit Javascript noch nicht beschäftigt habe.

Dann wird's wohl ein bisschen Einarbeitung erfordern.

gruß,
wahsaga