vue.js-div滚动条隐藏但有滚动效果的实现方法
组件被包在一个高度固定的div
mounted(){
varboDiv=document.getElementById(this.id);
if(boDiv==undefined){
return;
}
varisFirefox=navigator.userAgent.indexOf("Firefox")
if(isFirefox>0){
boDiv.addEventListener('DOMMouseScroll',function(event){//火狐
varevt=window.event||arguments[0]
if(evt.detail<=-3){
boDiv.scrollTop=boDiv.scrollTop-10
}elseif(evt.detail>=3){
boDiv.scrollTop=boDiv.scrollTop+10
}
evt.stopPropagation();
evt.preventDefault();
},false);
}else{
boDiv.addEventListener("mousewheel",function(event){
varevt=window.event||arguments[0]
evt.returnValue=false//屏蔽body滚动事件
if(evt.wheelDelta<=-120){
boDiv.scrollTop=boDiv.scrollTop+40
}elseif(evt.wheelDelta>=120){
boDiv.scrollTop=boDiv.scrollTop-40
}
})
}
}
}
以上这篇vue.js-div滚动条隐藏但有滚动效果的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持毛票票。