Element.scrollIntoView()

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

Specification Status Kommentar
CSS Object Model (CSSOM) View Module
Die Definition von 'Element.scrollIntoView()' in dieser Spezifikation.		 Arbeitsentwurf Initial definition

Browser Kompatibilität

Wir konvertieren die Kompatibilitätsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilitätstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!

Eigenschaft Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Grundfunktionen 1.0 1.0 (1.7 oder früher) 6 10.0 4
scrollIntoViewOptions Nicht unterstützt 36 (36) Nicht unterstützt Nicht unterstützt Nicht unterstützt
Eigenschaft Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Grundfunktionen ? 1.0 (1.0) ? ? ?
scrollIntoViewOptions Nicht unterstützt 36.0 (36) Nicht unterstützt Nicht unterstützt Nicht unterstützt

Siehe auch