How to hide the scroll bar in vue.js-div

This time I will show you how to hide the scroll bar in vue.js-div. What are the precautions for vue.js-div to hide the scroll bar? The following is a practical case, let’s take a look.

The component is wrapped in a height-fixed p

mounted () {
  var bop = document.getElementById(this.id);
  if(bop == undefined){
  return;
  }
  var isFirefox=navigator.userAgent.indexOf("Firefox") 
  if(isFirefox>0){ 
  bop.addEventListener('DOMMouseScroll', function(event) { //火狐
   var evt = window.event || arguments[0]
   if (evt.detail <= -3) { 
   bop.scrollTop=bop.scrollTop-10
   } else if (evt.detail >= 3) {
   bop.scrollTop=bop.scrollTop+10
   }
   evt.stopPropagation();
   evt.preventDefault();
  }, false); 
  }else{
  bop.addEventListener("mousewheel",function(event) {
   var evt = window.event || arguments[0]
   evt.returnValue = false //屏蔽body滚动事件 
   if (evt.wheelDelta <= -120) { 
   bop.scrollTop=bop.scrollTop+40
   } else if (evt.wheelDelta >= 120) {
   bop.scrollTop=bop.scrollTop-40
   }
  })
  } 
 }
 }

I believe you have mastered the method after reading the case in this article. Please pay attention for more exciting things. Other related articles on php Chinese website!

Recommended reading:

Web-side application implements back force refresh

How to use automatic generator in ionic2

The order of operating Vue rendering and plug-in loading

The above is the detailed content of How to hide the scroll bar in vue.js-div. For more information, please follow other related articles on the PHP Chinese website!