Body can scroll horizontally on Android

[kench928]

Environment: Android 4.4.4 / Sony Xperia Z

After opening the mobile menu, you can touch on the underneath menu area and scroll horizontally (like what you see on the attchment [screenshot_2014-10-22-23-56-35]). And then after you close it, the whole screen moved left and not in the correct position (like attchement [screenshot_2014-10-23-01-27-31]).

I can't find any solution and colud someone figure it out how to fix it? Thanks a lot.

[kench928]

To supplement: I have same problem on Android Chrome 38.0.2125.102 and Android Firefox 33.0.

[brutto]

Confirm that bug. Its not only Android issue, but can be repeatable on decktop with touchscreen with Chrome 38+ 8( You can repeat this behaviour on expample page just open left-side menu and than touch menu in any point and swipe it to right... =\

[HalloTobi]

We're encountering a similar behaviour on iOS 7+8, too. :cry:

[devben]

I was also experiencing this and the following css appears to have resolved the issue

.snapjs-right,
.snapjs-left {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

[ashishsajwan]

:+1:

[Ninos]

Think @devben's solution is not really good. If you scroll down then acticate the menu, the body content jumps to top again. I solved it with following js-snippet:

this.snapper.on('animated', function() {
    if( jQuery('body').hasClass('snapjs-left') || jQuery('body').hasClass('snapjs-right') ) {
        jQuery('body').css({
            position: 'fixed',
            top: jQuery(window).scrollTop() * -1
        });
    }
    else if( jQuery('body').css('position') == 'fixed' ) {
        var top = parseFloat( jQuery('body').css('top') ) * -1;
            jQuery('body').css({
            position: '',
            top: 0
        });

        if( top != 0 ) {
            jQuery(window).scrollTop( top );
        }
    }
});

The only problem here is, that on android the page seems to get rendered again, so you have a blank page for some ms (1-10ms). Not very nice, but better than the other solution.

If someone has a better idea, just let me know :P

[alexiovay]

Any new solution to this?