Den Inhalt eines scrollbaren <div>s scrollen

[BeAT]

Hallo zusammen,

ich habe ein <div> Element, welches mittels der CSS Eigenschaft overflow: scroll; scrollbar gemacht wurde.

Ist es per JavaScript möglich den Inhalt dieses <div>s zu scrollen?
Das <div> an sich enthält Elemente die jeweils mit einer Id versehen sind. Über dem <div> soll nun ein button sein der z.B. zum Element mit der Id "xyz" innerhalb des <div>s scrollt sobald man den button betätigt.

Ist dies möglich?

Danke im Voraus.

[molily]

Hallo,

Ist es per JavaScript möglich den Inhalt dieses <div>s zu scrollen?

Ja, indem du die Eigenschaft scrollTop des div-Elementobjektes änderst, das overflow:scroll besitzt. Dieser kannst du Zahlen zuweisen, 0 bedeutet ganz oben und dann in Pixelschritten.

Das <div> an sich enthält Elemente die jeweils mit einer Id versehen sind. Über dem <div> soll nun ein button sein der z.B. zum Element mit der Id "xyz" innerhalb des <div>s scrollt sobald man den button betätigt.

Die relative Position dieses Buttons zu berechnen, um den richtigen scrollTop-Wert zu bekommen, ist schon schwieriger. Da gibt es wahrscheinlich verschiedene Ansätze. Der Button dürfte einen http://de.selfhtml.org/javascript/objekte/all.htm#offset_top@title=offsetTop-Wert relativ zum scrollbaren div haben, wenn dieses div position:relative hat. (Prüfe das über http://de.selfhtml.org/javascript/objekte/all.htm#offset_parent@title=offsetParent.)

Mathias

[Gunnar Bittersmann]

@@BeAT:

Ist dies möglich?

Die erste Frage wäre: Ist dies sinnvoll?

Ich würd sagen: Nein. [1, 2]

Live long and prosper,
Gunnar

[Beat]

@@BeAT:

Ist dies möglich?

Die erste Frage wäre: Ist dies sinnvoll?

Du kannst sie sinnlos erfüllen, aber das heisst nicht dass das Anliegen sinnlos ist oder nicht sinnvoll erfüllt werden kann.

a) inwiefern sollte normales Scrollen verhindert werden, wenn die auslösende Funktion ja nicht scrollbar ist, und automatisches Scrollen nur dann bewirkt, solange die Maus über dem Aktivator ist?
b) Inwiefern macht ausgeschaltetes Javascript ein solches <div> normal unscrollbar?

Und um die Alternative (Ankerlink) zu erwähnen. Inwiefern ist es weniger irritierend, wenn der Anker nicht nur innerhalb eines scrollbaren <div> springt, sondern das Fenster noch gleich so verschiebt, dass die Links aus dem Blickbereich verschwinden?

Ich halte das Anliegen für legitim und für lösbar, ohne dass es zu Behinderungen kommt.

mfg Beat (der Stammgast)

[Gunnar Bittersmann]

@@Beat:

a) inwiefern sollte normales Scrollen verhindert werden

Wird es in diesem Fall nicht. Aber wozu die Seite mit zusätzlichem Zeug vollmüllen, das Nutzer nicht brauchen? Die Frage nach der Sinnhaftigkeit besteht, auch wenn die normalen Scrollbars nicht unterdrückt werden.

Live long and prosper,
Gunnar

[romy]

Hi BeAT,

ich habe ein <div> Element, welches mittels der CSS Eigenschaft overflow: scroll; scrollbar gemacht wurde.
Ist es per JavaScript möglich den Inhalt dieses <div>s zu scrollen?
Das <div> an sich enthält Elemente die jeweils mit einer Id versehen sind. Über dem <div> soll nun ein button sein der z.B. zum Element mit der Id "xyz" innerhalb des <div>s scrollt sobald man den button betätigt.

Das klingt, als wolltest du zu einem definiertem Anker springen? Das kannst du ohne Javascript über die Ankerfunktionalität bei Verweisen.

  
<a href="#anker">Verweis</a>  
<p>viel Inhalt</p>  
<a id="anker">irgendwas</a>  

~~~ [1]  
  
ciao  
romy  
  
[1] hätte gern die entsprechende Selfhtmlseite verlinkt, aber stelle mich gerade an aus der Suchseite die richtige URL zu bekommen, weil ich das Ankerthema nur über die Suche gefunden habe.

-- 
[Sie möchten einem Tier ein neues zu Hause geben?](http://www.findeltiere.de/index.php?navi=abzugeben)  
  
![](http://www.romy-b.de/Zeug/gans.jpg)

[BeAT]

Hallo zusammen,

danke für die Beiträge.
Grüße
BeAT

[romy]

Hi BeAT,

danke für die Beiträge.

Bitte.
Wie hast du es letztendlich gelöst?

ciao
romy

[BeAT]

Wie hast du es letztendlich gelöst?

Ich werde mich heute der Lösung widmen.