/Javascript/jQuery/Animated scroll to anchor without jquery

Animated scroll to anchor without jquery

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)
        }
    })()
}

Source: stackoverflow.com

Animated scroll to anchor without jquery

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);
};

Source: stackoverflow.com

Similar codes

111 votes286 views6 answers
Jquery link cdn
Javascript jQuery
115 votes318 views6 answers
Jquery checkbox is checked
Javascript jQuery
0 vote169 views1 answer
How to set name attribute in jquery
Javascript jQuery
20 votes143 views4 answers
Jquery get name attribute
Javascript jQuery
87 votes133 views6 answers
Onclick function jquery
Javascript jQuery
1 vote139 views3 answers
Jquery set title attribute
Javascript jQuery
0 vote128 views2 answers
Stop a video jquery
Javascript jQuery
14 votes930 views3 answers
Jquery set inner text
Javascript jQuery
9 votes118 views5 answers
Check hidden element in jquery
Javascript jQuery
0 vote140 views1 answer
Jquery select convert into input text
Javascript jQuery