# Plain JavaScript animated window scroll function

DevFeed: [Plain JavaScript animated window scroll function](<https://devfeed.tech/articles/plain-javascript-animated-window-scroll-function-37237.md>)

Original publisher: [Read original article](<https://muffinman.io/blog/animate-window-scroll-to/>)

Author: Stanko

Published: 2016-09-28T00:00:00Z

Content type: tutorial

Language: en

Sources: [Stanko Tadić](<https://devfeed.tech/sources/stanko-tadic.md>)

Topics: [JavaScript](<https://devfeed.tech/topics/javascript.md>), [Vanilla JavaScript](<https://devfeed.tech/topics/vanilla-js.md>), [npm](<https://devfeed.tech/topics/npm.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>)

Tags: [element](<https://devfeed.tech/tags/element.md>), [import](<https://devfeed.tech/tags/import.md>), [input](<https://devfeed.tech/tags/input.md>), [javascript](<https://devfeed.tech/tags/javascript.md>), [npm](<https://devfeed.tech/tags/npm.md>), [object](<https://devfeed.tech/tags/object.md>)

## AI overview

A tutorial presenting a plain JavaScript function for smoothly animating window scrolling without requiring jQuery. It documents the animated-scroll-to npm package, including installation, usage, duration settings, the scroll element, and cancellation on user input.

## Source excerpt

Before modern frameworks, I always used jQuery's scrollTo method. At some point, not every project included jQuery, so I wrote simple function to animate window scroll. I have kept copying that function from project to project. Finally I took some time, cleaned it up and published it on the npm (this is the first npm package I published). Check the demo and read documentation of Github. Find it on Github and npm Installation # npm install animated-scroll-to Usage # import animateScrollTo from 'animated-scroll-to'; // desiredOffset - page offset to scroll // options - object with options // default options const options = { // duration of the scroll per 1000px, default 500 speed: 500, // minimum duration of the scroll minDuration: 250, // maximum duration of the scroll maxDuration: 1500, // DOM element to scroll, default window // Pass a reference to a DOM object // Example: document.querySelector('#element-to-scroll'), element: window, // should animated scroll be canceled on user scroll/keypress // if set to "false" user input will be disabled until animated scroll is complete cancelOnUserAction: true }; const desiredOffset = 1000; animateScrollTo(desiredOffset, options);