简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - 当页面在滚动的时候. 把:hover和鼠标事件干掉.防止误触发带来的rendering，使页面滚动不流畅！
PHP中文网
PHP中文网 2017-04-10 16:27:01
0
1
578

我的做法是. 当页面滚动的时候给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..

PHP中文网
PHP中文网

认证0级讲师

reply all(1)
巴扎黑
巴扎黑2017-04-10 16:29:01 1 floor

你可以设置一个超时定时器
在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);
        
});
Like +0
Add Reply
Popular Topics
More>
Popular Articles
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！