Categories:

Moving, scrolling, and resizing a window

The window object of JavaScript supports some controversial methods that let you perform tasks such as move the user's window, resize it, or scroll the page within it automatically/ programmatically. The philosophical issue aside, lets see how this is done!

The new window methods

With the help of 6 new window methods, moving, scrolling, and resizing a window programmatically becomes trivial a task. These new methods are:

Methods Description
moveBy(dx, dy)  Moves a window by the specified amount in pixels
moveTo(x, y) Moves a window to the specified pixel values
scrollBy(dx, dy) Scrolls a window by the specified amount in pixels
scrollTo(x, y) Scrolls a window to the specified pixel values
resizeBy(dx, dy) Resizes a window by the specified amount in pixels
resizeTo(x y) Resizes a window to the specified pixel values

Remember, all of the above methods exist on the window object itself, meaning both of the following two syntax to accessing them are valid:

  • window.moveBy(x,y)

  • moveBy(x,y)

Ok, now that we know the methods themselves, let's learn how to apply them to their application of expertise!