Ionic 2 disable scroll

Question

I've tried several methods to disable scroll, including using CSS position: fixed, attribute overflow-scroll="false" and etc, but all methods failed.

When I swipe down, the buttons will go up and while I swipe up the buttons will go down, like bouncing effect.

May I know any solutions to this issue? Thank you very very much.

Answer 1

I solved same problem using css. (Ionıc 3.6)

Step1: In ion-content add a new class :

<ion-content class="no-scroll">

Step2: In your CSS add the code below :

.no-scroll .scroll-content{
    overflow: hidden;
}

Answer 2

For disable scroll in ion-content can use setScrollDisabled() method. You should follow steps below.

In hello.ts

 import { app } from 'ionic-angular';

   public class HelloPage
   {
       constructor(private app: App) {};

        ngAfterViewInit(){
        this.app.setScrollDisabled(true);
      }
    }

Answer 3

Content is placed in the scrollable area if provided without a slot. To show a fixed content add slot="fixed".

<ion-content>
<div slot="fixed">

</div>
</ion-content>