滚动到顶部 - Pure Vanilla JS

时间:2018-05-03 11:12:21

标签: javascript jquery

正如标题所说,如何通过此处找到的easing transition来实现: https://gist.github.com/gre/1650294

请在下面查看我想要'在纯javascript中做:

var up = $('#toTop');
$(window).scroll(function() {
    $(this).scrollTop() < 300 ? up.fadeOut() : up.fadeIn();
});
$('#toTop').click(function() {
    $('html, body').stop().animate({
        scrollTop: 0
    }, 2000, 'easeInOutQuart');

jQuery EXEMPLE

在这里,我对香草的尝试失败了:

(function() { // reveal arrow
    var arrow = document.getElementById('toTop'),
        myPage = document.querySelectorAll('html, body'),
        revealArrrow = function() {
            var y = window.scrollY;
            y >= 600 ? arrow.className = 'show' : element.classList.remove('show');
        };
    arrow.addEventListener('click', function(e) {
        myPage.animate({
            scrollTop: 0
        }, 2000, 'easeInOutQuart');
    });
    window.addEventListener('scroll', revealArrrow);
})();
EasingFunctions = {
    easeInOutQuart: function(t) {
        return t < 0.5 ? 8 * t * t * t * t : 1 - 8 * (--t) * t * t * t
    }
}

VANILLA JS ATTEMPT

也许与setTimeout ...?

非常感谢。

0 个答案:

没有答案