Popover, background still scrollable

Ionic Framework ionic-v3
1

When a popover is showed, user still be able to scroll the background which was suppose to be overlay and locked, is that normal behaviour and are there any ways to prevent that? I wish to hv the background unscrollable.

2

Did you solve this? I’ve noticed this same behaviour in IOS.

3

Managed to work around this issue by:

Adding the following in app.scss

ion-app.disable-scroll {
    ion-content>.scroll-content {
        overflow: hidden;
    }
}

In the popover/modal .ts file, add the following

    ionViewDidLoad() {       
        document.getElementsByTagName("ion-app").item(0).classList.add("disable-scroll");
    }    

    ionViewWillLeave(){
        if ( document.getElementsByTagName("ion-app").item(0).classList.contains("disable-scroll") )
            document.getElementsByTagName("ion-app").item(0).classList.remove("disable-scroll");
    }

Hope this helps.

Inspired from the idea suggested by longzheng in ionic2 - bug(backdrop?)

1 Like