window scrolling

Last updated 2 years ago

Was this helpful?

window scrolling

⟩ ⟩ ⟩ ⟩ scroll

-reflecting body element ：

if you assign one of the following event handlers on , it will be reflected on too, and vice versa.

onblur, onerror, onfocus, onload, onresize, onscroll

const body = document.body;
body.onblur = function f(){};        // assigned on body
window.onblur                        // f: reflected on window

window.onresize = function g(){};    // assigned on window
body.onresize                        // g: reflected on body

📗

window takes the x and y coordinates and sets these as the scrollbar offsets (the browser will try its best to scroll the window so that the specified point is in the upper-left corner of the viewport).

calling elem will try to put the top edge of the at or near the top of the .
you can use an options object {block:inline:} to control the vertical/horizontal alignment of the scrolling.

is effectively the same as .
For relative scrolling, see , , and .
For scrolling elements, see and .

To scroll the page with JavaScript, its DOM must be fully built, if we try to scroll the page with a script in <head> , it won’t work.

// heights of the document and viewport.
const doc = { height: document.documentElement.offsetHeight };
const viewport = { height: window.innerHeight };
const scrollOffsetY = doc.height - viewport.height;

// scroll to the "bottom" of the page
window.scrollTo(0, scrollOffsetY);

Previousviewport Nextscroll smoothly

Last updated 2 years ago

Was this helpful?