nicht angemeldet
Position von Scrollbar merken ... auch für <div> möglich?
Hallo!
Mein Problem:
Ich habe eine Bildlaufleiste mit Scrollbar und daneben wird das angeklickte Bild angezeigt. Dies geschieht, indem sich die Seite neu aufbaut (und per PHP das entsprechende Bild wählt.) Unschön dabei ist, dass die Bildlaufleiste bei jedem Seitenneuaufbau wieder an den Anfang springt.
Mein Lösungsansatz:
Per Javascript möchte ich mir die Stellung der Scrollbars merken, an die neue Seite übergeben und dort den Scrollbar automatisch in die alter Position rücken. Dass geht wohl über pageYOffset und scrollTo().
Meine Frage:
Funktioniert so was auch, wenn (wie bei mir) der gescrollte Inhalt in einer <div>-Box sitzt und nicht die ganze Seite gescrollt wird? Ich frage hier (und probiere es nicht einfach aus), weil ich noch nie mit Javascript gearbeitet habe und mich (falls es erfolgsversprechend ist) erst mal einarbeiten müsste ;-)
Liebe Grüße, Stefan
-
hi,
Ich habe eine Bildlaufleiste mit Scrollbar und daneben wird das angeklickte Bild angezeigt. Dies geschieht, indem sich die Seite neu aufbaut (und per PHP das entsprechende Bild wählt.) Unschön dabei ist, dass die Bildlaufleiste bei jedem Seitenneuaufbau wieder an den Anfang springt.
Unschön ist, dass sich dabei die Seite neu aufbaut.
Warum nimmst du keinen Bildwechsel per Javascript vor, der ohne Neuladen der kompletten Seite auskäme?Per Javascript möchte ich mir die Stellung der Scrollbars merken, an die neue Seite übergeben und dort den Scrollbar automatisch in die alter Position rücken. Dass geht wohl über pageYOffset und scrollTo().
Meine Frage:
Funktioniert so was auch, wenn (wie bei mir) der gescrollte Inhalt in einer <div>-Box sitzt und nicht die ganze Seite gescrollt wird?Ja - statt der oben genannten Eigenschaften für window müsstest du bei einem beliebigen anderen Element, bei dem über eine entsprechende overflow-Angabe ggf. Scrollbalken angezeigt werden, .scrollTop auslesen bzw. neu setzen.
Ist eine MS-Erfindung, funktioniert aber m.W. in anderen Browsern wie Opera oder Geckos ebenfalls.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Danke!
Unschön ist, dass sich dabei die Seite neu aufbaut.
Warum nimmst du keinen Bildwechsel per Javascript vor, der ohne Neuladen der kompletten Seite auskäme?Ich hatte eigentlich vor, die Seite ganz ohne Javascript zu machen, weil ich gelesen habe, dass ca. 10% der Nutzer es abgeschaltet hätten und die könnten die Bilder dann ja gar nicht sehen ... im Fall der Bildlaufleiste wäre es ja nur eine Schönheitsfehler ohne Javascript aber die Seite wäre weiterhin nutzbar.
Will aber nicht sagen, dass ich fest zu meiner Meinung stehe ... hatte mich (aus diesem Grund) noch nicht mit Javascript beschäftigt. Was wäre denn der Vorteil, wenn sich die Seite nicht neu aufbaut? Die Ladezeit wäre doch nicht das Problem, da alles (außer dem neuen Bild) doch eh schon im Cache ist, oder?
Stefan
-
hi,
Ich hatte eigentlich vor, die Seite ganz ohne Javascript zu machen, weil ich gelesen habe, dass ca. 10% der Nutzer es abgeschaltet hätten und die könnten die Bilder dann ja gar nicht sehen ... im Fall der Bildlaufleiste wäre es ja nur eine Schönheitsfehler ohne Javascript aber die Seite wäre weiterhin nutzbar.
Natürlich sieht man für solche Fälle idR. Fallback-Mechanismen vor - hat der User JS aktiviert, würde nur das Bild ausgetauscht, andernfalls eine neue Seite mit geändertem Bildinhalt geladen.
Was wäre denn der Vorteil, wenn sich die Seite nicht neu aufbaut?
Die ruhigere Optik beispielsweise.
Ich klicke auf Bild, Bild wird kurz geladen, und dann angezeigt.
Neues Aufbauen der Seite, wieder hinscrollen an die vorherige Position, etc. - entfällt.Die Ladezeit wäre doch nicht das Problem, da alles (außer dem neuen Bild) doch eh schon im Cache ist, oder?
Externes CSS und Javascript wird vielleicht gecached - aber das HMTL-Dokument müsstest du jedes mal neu laden, schließlich willst du darin ja die Bildadresse ändern.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Also ...
<div id="bildleiste" onmouseover=(this.scrollTop=530)>
... funktioniert (sogar auf allen Browsern, die ich habe), aber das mit der Maus ist natürlich in meinem Fall Quatsch.
Wie schreibt man das denn auf, wenn this.scrollTop=530 ohne weitere Bedungung (also einfach beim Anzeigen der Datei) ausgeführt werden soll? Etwa ...
<div id="bildleiste" onload=(this.scrollTop=530)>
... oder nur ...
<div id="bildleiste" (this.scrollTop=530)>... hat leider beides keinen Effekt :-(
onload ist wohl auch nur für <body> erlaubt ...Sorry, hab leider so wenig Ahnung davon ... ;-)
Liebe Grüße, Stefan
-
-
-