在 Cordova iOS 中禁用滚动条

Question

i want to disable the Scrollbar in my iOS App. The Content should be scrollable, but the scrollbar should be invisible.

How can i realize this?

Answer 1

The other answer is great and perfect (as far as I know) for most browsers. However, if you were just targeting iOS and/or Android, this CSS would be simpler, sufficient, and requires no structural changes to your HTML:

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

I just tested this myself. Works with webkit browsers, which means it'll work for Android/iOS.

Answer 2

You can try this first overflow-y: hidden; will hide both the scroll bar and then overflow-y: scroll; will allow to scroll vertically.

CSS

#content {
    position: relative;
    width: 200px;
    height: 150px;
    border: 1px solid black;
    overflow: hidden;
}
#scrollable {
   height: 150px;   
   width: 218px;
   overflow-y: scroll;    
}

HTML:

<div id="content">
    <div id="scrollable">
         <!--Content goes here-->
    </div>
</div>

Hope this helps.!

Answer 3

None of the above answers worked for me as of 2020 so here's what fixed it for me:

Apply

overflow-y: scroll;
-webkit-overflow-scrolling: touch;

Where you would like to hide the scrollbar