Breaking News: Grepper is joining You.com. Read the official announcement!

animated scroll to anchor without jquery

Difficult Dormouse answered on June 19, 2021 Popularity 3/10 Helpfulness 1/10

answer animated scroll to anchor without jquery

related animated scroll to anchor without jquery

animated scroll to anchor without jquery

Comment

const requestAnimationFrame = window.requestAnimationFrame ||
    window.webkitRequestAnimationFrame ||
    window.mozRequestAnimationFrame ||
    window.oRequestAnimationFrame ||
    window.msRequestAnimationFrame;

function scrollTo(to) {
    const start = window.scrollY || window.pageYOffset
    const time = Date.now()
    const duration = Math.abs(start - to) / 3;

    (function step() {
        var dx = Math.min(1, (Date.now() - time) / duration)
        var pos = start + (to - start) * easeOutQuart(dx)

        window.scrollTo(0, pos)

        if (dx < 1) {
            requestAnimationFrame(step)
        }
    })()
}

Popularity 3/10 Helpfulness 1/10 Language javascript

Source: stackoverflow.com

Tags: anchor animated javascript jquery scroll

Link to this answer
Share Copy Link

Contributed on Jun 19 2021

Difficult Dormouse

0 Answers Avg Quality 2/10

Closely Related Answers

animated scroll to anchor without jquery

Comment

function animate(elem, style, unit, from, to, time, prop) {
    if (!elem) {
        return;
    }
    var start = new Date().getTime(),
        timer = setInterval(function () {
            var step = Math.min(1, (new Date().getTime() - start) / time);
            if (prop) {
                elem[style] = (from + step * (to - from))+unit;
            } else {
                elem.style[style] = (from + step * (to - from))+unit;
            }
            if (step === 1) {
                clearInterval(timer);
            }
        }, 25);
    if (prop) {
          elem[style] = from+unit;
    } else {
          elem.style[style] = from+unit;
    }
}

window.onload = function () {
    var target = document.getElementById("div5");
    animate(document.scrollingElement || document.documentElement, "scrollTop", "", 0, target.offsetTop, 2000, true);
};

Popularity 3/10 Helpfulness 1/10 Language javascript

Source: stackoverflow.com

Tags: jquery anchor animated scroll javascript

Link to this answer
Share Copy Link

Contributed on Jun 19 2021

Difficult Dormouse

0 Answers Avg Quality 2/10

animated scroll to anchor without jquery

Contents

More Related Answers

animated scroll to anchor without jquery

Closely Related Answers

animated scroll to anchor without jquery

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.