JavaScript scrollBy(x,y) does not work with style column-width in Android WebView

user_920255 0
Viewed 54

I am displaying Epubs in an Android WebView. To make it scroll horizontal, I have added these css rules:

    $("html").css("padding", 0);
    $("html").css("margin", 0);
    $("html").css("width", document.documentElement.clientWidth);
    $("body").css("padding", 0);
    $("body").css("margin", 0);
    $("body").css("height", document.documentElement.clientHeight);
    $("body").css("column-gap", 0);
    $("body").css("column-width", document.documentElement.clientWidth);

This works fine, but if I start scrolling pages by using

window.scrollBy(document.documentElement.clientWidth, 0)

It always stops working 3 pages before the end of the xhtml file. window.scrollBy and window.scrollTo stops working, nothing happens. This is on all epubs I have tested on. Nothing works. If I scroll using the Android WebView#scrollTo(x,y) it works without any issues. But I need to use JavaScript for scrolling because of some special requirements. It seems that JavScript has the incorrect scrolling width, but I have no idea how to solve it. Help is very much appreciated

android-webview android css javascript
1 Answers

Setting a viewport in the header fixed this issue

user_9202550
Related