How to stop INTERNAL scrolling of WebView in Android?

Question

I have a WebView in my application which has HTML content rendered in it and size of HTML content is larger than size of WebView. Due to which content is scrolling inside it when user drags his/her finger on it. I want to stop this INTERNAL scrolling being happening with content.

Heres what I have already tried so far:

WebView view = new WebView(context);  //context is of Activity
view.setHorizontalScrollBarEnabled(false);
view.setVerticalScrollBarEnabled(false);
view.setScrollContainer(false);

and in CSS as:

overflow : hidden !important;

Kindly suggest solutions except Disabling Finger Drag (Hack) for webview because that disturb my other functionality, which is as follows:

@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
    if(motionEvent.getAction() == MotionEvent.ACTION_MOVE)
    {
        return true;
    }
  }

click [here](http://stackoverflow.com/a/5274400/4419437) i hope this will help you :) — asim mahmood Khan, Jan 07 '15 at 13:11
@asimmahmoodKhan I have mentioned all these solutions in my question. Kindly check first. Thanks :) — Perry, Jan 07 '15 at 13:19
[click here](http://stackoverflow.com/a/8654192/4419437) i think it this code will help you.Sory For Last Comment :) — asim mahmood Khan, Jan 08 '15 at 13:39
@asimmahmoodKhan Thank you very much for your efforts bro.**+1** for your help. I have looked in your suggestion deeply. Actually this too is same as **Disabling Finger Drag**(Hack) as i mentioned above. This JS code is same as following Android code: `public boolean onTouch(View view, MotionEvent motionEvent) { if(motionEvent.getAction() == MotionEvent.ACTION_MOVE) { return true; } }` It also stops scaling, zooming etc. Which is not what i have to do. Please look if anything else figured out. :) — Perry, Jan 09 '15 at 12:13

score 4 · Accepted Answer · answered Feb 09 '15 at 16:08

4

Add a container to your webview that wraps all your content and sits just below the body element, like so:

<body id="myBody">
  <div class="container">
    <!-- All your content goes in this new div.container -->
  </div>
</body>

Then, add this CSS to your page:

body {
  height: 100%;
  width: 100%;
  pointer-events: none;
}
div.container {
  overflow: hidden!important;
  height: 100%;
  width: 100%;
}

The problem is that a WebView seems to ignore scrolling on the body despite overflow rules, and since a body expands to meet its contents, it'll always think there is more to scroll to. What this is doing is resetting the body to the size of the WebView, and then using the container to keep the body from expanding beyond the WebView with more content.

Hope that helps.

answered Feb 09 '15 at 16:08

Josh Burgess

9,327
33
46

Yeah @Josh Burgess, that surely works!!! Me too did same thing at last when didn't found anything in android(JAVA). Just forgot to post here. Thanks a ton dude :) :) :) – Perry Feb 11 '15 at 16:56
Hy, I have tried your solution and indeed the scroll stops using the following command: overflow: hidden!important; but the problem is that my html is a flowable text, and I make horizontal paging so the user can flip the pages horizontally. This command clips the file so the rest of the html is clipped, I wish if I can stop only the vertical scroll. – coder Oct 20 '17 at 07:11
It still clips the HTML horizontally – coder Oct 20 '17 at 07:41
You have to disable all overflow hidden rules on the parent and the element itself, then only apply `overflow-y: hidden` – Josh Burgess Oct 20 '17 at 07:43
I don't have any overflow rules. if I remove this command: overflow-y: hidden. The flow goes back to normal, but I add it, it clips the HTML and disallow horizontal and vertical drag. I don't mind disallowing horizontal and vertical drag, but I can't have the rest of HTML clipped – coder Oct 20 '17 at 07:46
I suggest you create a new question with a minimally reproducible case, then. – Josh Burgess Oct 20 '17 at 07:47
https://stackoverflow.com/questions/46845536/disable-web-view-vertical-drag-without-clipping-the-content – coder Oct 20 '17 at 08:50

How to stop INTERNAL scrolling of WebView in Android?

1 Answers1