【亲测】IE、火狐Firefox和谷歌Chrome浏览器下隐藏滚动条并且可以滚动的方法

隐藏滚动条并且可以滚动

经过多次试验，以下这种CSS写法，可以完美支持在IE、火狐Firefox和谷歌Chrome浏览器下隐藏滚动条并且可以滚动的效果，收藏一下。

.scroll-div {
  /*隐藏滚动条，当IE下溢出，仍然可以滚动*/
  -ms-overflow-style: none;
  /*火狐下隐藏滚动条*/
  scrollbar-width: none;
}

.scroll-div::-webkit-scrollbar {
  display: none;
}

.scroll-div {

/*隐藏滚动条，当IE下溢出，仍然可以滚动*/

-ms-overflow-style: none;

/*火狐下隐藏滚动条*/

scrollbar-width: none;

}

.scroll-div::-webkit-scrollbar {

display: none;

}

.scroll-div为带有滚动的元素，当然也可以换成html元素标签，这样最外层页面就可以隐藏滚动条并且可以滚动

以上代码在一下浏览器中测试通过：

Google Chrome 76+
Microsoft Edge
IE 11
Firefox 68+

【亲测】IE、火狐Firefox和谷歌Chrome浏览器下隐藏滚动条并且可以滚动的方法

文章评论