前端开发scroll事件


我在浏览器scroll事件中不断改变一个元素的top值,元素top值的改变为什么不流畅,一跳一跳的,怎么才能解决

前端 web前端开发 JavaScript 前端开发 scroll

lzcllyt 9 years, 8 months ago

不要直接操作元素的值,最好用变量代替元素值的变化,前段性能优化中就有尽量减少dom元素操作

活到老宅到老 answered 9 years, 8 months ago

将滚动回调函数中使用到的对象之类的,除非需要根据条件计算的,其他的通通先用变量缓存起来。这样在某些情况下是可以实现一定程度的优化的。

╃掱惢▓▓↗ answered 9 years, 8 months ago

推荐使用基于jQuery的 animate 动画函数以及 scrollTop 方法,平稳过渡效果,时间可控制,封装代码如下:


 /**
 * 自动页面滚动至某元素
 * @param {Object} obj 主对象
 * @param {Number} time 页面滚动至某元素所需时间
 * @example autoscroll($('#goTop'),100)
 */ 
function autoscroll(obj,time){
    var $this = $(obj);
    if(!time) time = 500;
    var $top = $this.offset().top;
    $('html,body').animate({
        scrollTop:$top
    },time);
}

CROWj answered 9 years, 8 months ago

Your Answer