开发者社区> 问答> 正文

当页面在滚动的时候. 把:hover和鼠标事件干掉.防止误触发带来的rendering,使页面滚动不流畅!

我的做法是. 当页面滚动的时候给html加个css: pointer-events:none;

现在碰的问题是当页面不滚动的时候如何把这个css:pointer-events:none 去掉....

我是这样做的..

$(document).scroll(function(){
        $('body').addClass('pointer-none').delay(500).queue(function(next){
            $('body').removeClass('pointer-none');
            next();
        });
    });

不过上述每次滚动都会触发这个removeclass. 我想要的是连续滚动中间没有停止滚动的话是不要触发这个removeclass的.

停止滚动的话才触发这个removeclass..

展开
收起
杨冬芳 2016-06-06 15:38:10 3260 0
1 条回答
写回答
取消 提交回答
  • IT从业

    你可以设置一个超时定时器
    在timeout设置的时间范围内如果发生触发了scroll事件,那么就将之前设置的定期器取消
    如果在指定的时间范围内没有滚动事件触发,那么执行removeClass的操作

    
    var timer,timeout=1000;
    $(document).scroll(function(){
        if(!timer){
            $('body').addClass('pointer-none');
        }else{
            clearTimeout(timer);
            timer=null;
        }
        timer=setTimeout(function(){
            $('body').removeClass('pointer-none');
            next();
            timer=null;
        }, timeout);
            
    });
    2019-07-17 19:28:46
    赞同 展开评论 打赏
问答分类:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载