Disable web view vertical drag without clipping the content

问题

Hy every one, I have a web view on which I load HTML content for epub books. The web view content is paginated so the user can flip through the pages horizontally while reading the e-book. I use onFlingDo to swipe left and right and allow the user to surf the content. I have customized my webview as shown below:

public class newBTWebView extends WebView implements QuickAction.OnDismissListener, PopoverView.PopoverViewDelegate, GestureDetector.OnGestureListener {
    public newBTWebView(Context context) {
        super(context);
        this.ctx = context;
        setup(context);
        init(context);

    }

    public void init(Context context) {

         this.context = context;
         this.getSettings().setJavaScriptEnabled(true);
         addJavascriptInterface(new MyJavaScriptInterface(this.context), "HTMLOUT");

         gestureScanner = new GestureDetector(this);
         this.setVerticalScrollBarEnabled(false);
         this.setHorizontalScrollBarEnabled(false);

         this.setOnTouchListener(new View.OnTouchListener() {

             public boolean onTouch(View v, MotionEvent event) {
                 int action = event.getAction();
                 if(event.getAction() == MotionEvent.ACTION_DOWN)
                 {
                     countDown++;
                 }

                 if(event.getAction() == MotionEvent.ACTION_UP  && isLongPress)
                 {

                     lastTouchedX = (int)event.getX();
                     lastTouchedY = (int)event.getY();
                     //get selection

                 }
                 return gestureScanner.onTouchEvent(event);
             }
         });
     } 
     @Override
     public boolean onTouchEvent(MotionEvent event) {
         int[] l = new int[2];
         this.getLocationOnScreen(l);
         int X = (int)event.getX();
         int Y = (int)event.getY();
         this.displayR = new Rect(X, Y, X + 100, Y + 20);
         return super.onTouchEvent(event);

     }

     public boolean onFlingDo(float from, float to, float velocityX, float velocityY) {
         float diff = Math.abs(to - from);
         //swipe left or right depend on diff

    }
}

The web view is connected to this css file:

html {
    height:heightplaceholderpx;
    width:100%;
}

body {
    margin:0px;
    padding:0px;
    height:100%;
    width:100%;
    pointer-events: none;
}


#viewer {
    width:widthplaceholderpx;
    height:heightplaceholderpx; 
}

#book {
    width:widthplaceholderpx;
    height:heightplaceholderpx;

    margin-left:50px;
    margin-right:50px;
    margin-top:10px;

    -webkit-column-count:auto;
    -webkit-column-width:widthplaceholderpx;
    -webkit-column-gap:100px;
    text-align:justify;
}

div.container {
  height: 100%;
  width:widthplaceholderpx;
  overflow-y: hidden;
}

.h {
    margin-top:60px;
    margin-left:100px; 
    margin-right:100px;
}

img {
    max-width: 100%;
    height:auto;
}

My main purpose is to disable drag horizontally and vertically, while keeping the gestures and longClick and hyperlinks working and without clipping the HTML file horizontally so the user can surf the book horizontally.

Kindly note that overflow-y: hidden; disables the drag horizontally and vertically but also clips the content, therefore the user will only see the first page of the chapter.

Kindly if anything is ambiguous or further details are needed let me know. Thank you

来源：https://stackoverflow.com/questions/46845536/disable-web-view-vertical-drag-without-clipping-the-content