使用css平滑滚动翻译3D

Question

我们正在使用最小的js和css翻译3d属性来构建平滑的滚动库。我们有一个基础（如附加笔），但随着我们增加图像和文本内容的数量，动画开始抖动，有时甚至在我们滚动时跳跃。我们不确定我们是否正在使用最佳方法来实现这一目标。请查看随附的笔。

Link to pen

    $(function () {

    $('.wrapper').height($('.smooth').height());

    var scrollTimer = null;

    $(window).scroll(function () {
        if (scrollTimer) {
            clearTimeout(scrollTimer);
        }
        scrollTimer = setTimeout(requestAnimationFrameTog, 5)
    });

    $(window).resize(function () {
        $('.wrapper').height($('.smooth').height());
    });

});

function requestAnimationFrameTog() {
    scrollTimer = null;
    window.requestAnimationFrame(scrollerize);
}

function scrollerize() {
    var scroll = window.pageYOffset;
    $(".smooth").css({
        transform: 'translate3d(0px, -' + scroll + 'px, 0px)'
    });
}

谢谢：）