Element.scrollIntoView()

Experimental

Dies ist eine experimentelle Technologie
Da diese Technologie noch nicht definitiv implementiert wurde, sollte die Browserkompatibilität beachtet werden. Es ist auch möglich, dass die Syntax in einer späteren Spezifikation noch geändert wird.

Die Methode Element.scrollIntoView() scrolled das Element in den sichtbaren Bereich des Browsers.

Syntax

element.scrollIntoView(); // Gleich mit element.scrollIntoView(true)
element.scrollIntoView(alignToTop); // Boolean Argument
element.scrollIntoView(scrollIntoViewOptions); // Object Argument

Parameter

alignToTop
Dies ist ein Boolean Wert:
  • Bei true wird der obere Rand des Elements an den oberen Rand des sichtbaren Bereichs im Browser gescrolled.
  • Bei false wird der untere Rand des Elements an den unteren Rand des sichtbaren Bereichs im Browser gescrolled.
scrollIntoViewOptions
Ein Boolean oder Objekt mit den folgenden Optionen:
{
    behavior: "auto"  | "smooth",
    block:    "start" | "end",
}
Wenn der Wert ein Boolean, enspricht true {block: "start"} und false {block: "end"}.

Beispiel

var element = document.getElementById("box");

element.scrollIntoView();
element.scrollIntoView(false);
element.scrollIntoView({block: "end"});
element.scrollIntoView({block: "end", behavior: "smooth"});

Notizen

Das Element wird eventuell nicht ganz nach oben oder unten gescrolled. Je nach Layout der anderen Elemente.

Technische Daten

Browserkompatibilität

BCD tables only load in the browser

Siehe auch