使滚动条在移动浏览器中不可见

问题描述 投票:0回答:1

我想隐藏滚动条,而不禁用滚动

我在CSS中使用了这个规则:

::-webkit-scrollbar {
  display: none;
}

我也尝试过:

::-webkit-scrollbar {
  width: 0;
}

在 PC 上,它可以正常工作,在移动设备上,无论使用什么浏览器,我都尝试过 Safari 和 Chrome,但不起作用。

javascript ios iphone scrollbar progressive-web-apps
1个回答
0
投票

/* You can adjust your break point on the width to say when you want it visible */

@media screen and (max-width: 767px) {
  body {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  body::-webkit-scrollbar {
    display: none;
  }
}

.test {
  height: 1000px;
}
<body>
  <div class='test'>
    This div has a height of 1000px, you can scroll and the scrollbar is hidden.
  </div>
</body>

© www.soinside.com 2019 - 2024. All rights reserved.