JS触发滚动

滚动的话, document级别的用window.scrollTo(), element内部的, 直接设置element.scrollTop就行, 这些都是直接过去的.

滚动动画:

            ScrollTo(offsetTop, duration) {
                let startingY = this.$refs.asv.scrollTop;
                let diff = offsetTop - startingY;
                let start;
                const self = this;
                const easing = BezierEasing(0.61, 0.29, 0.3, 0.97);
                window.requestAnimationFrame(function step(timestamp) {
                    if (!start) start = timestamp;
                    var time = timestamp - start;
                    var percent = Math.min(time / duration, 1);
                    self.$refs.asv.scrollTop = startingY + diff * easing(percent);
                    if (time < duration) {
                        window.requestAnimationFrame(step);
                    }
                })
            }

通过贝塞尔曲线来达到缓入缓出的效果, 实现贝塞尔曲线的JS库BezierEasing(https://github.com/gre/bezier-easing)..) 通过AnimationFrame来达到完美的动画渲染效果.