[SOLVED] Disable Scrolling

Ionic Framework ionic-v3
#1

First of all: I know there are some topics about this already, but none of them seem to help me.

I tried all methods I could find to disable scrolling on one of my pages, but none of them work and so I come to seek help here.

What I tried:

  • Creating a css class which hides overflow (same with attr.noScroll)
  • setScrollDisabled
  • set a div as ion-fixed
  • ion-content no-bounce
  • ::-webkit-scrollbar
  • overflow-scroll=“false”

This is what my page looks like when I scroll down …
image
I only added a background picture which width i set to 100% and height auto (height: 100% produces same white bar)

For reference, here is my code if it helps

<ion-content>
  <img class="bgc" src="assets/background.png">
</ion-content>
3 Likes
#2

I also have that problem

1 Like
#3

For people who are interested: I have gotten two answers on another site:

  1. My particular problem was due to html tags taking up an extra line which can be fixed by adding
    display: block; to my background css class

  2. If you want to disable the scrolling whatsoever you can write a preventDefault function which negates every scrolling. The code for this is:

    preventDefault(e) {
    e = e || window.event;
    if (e.preventDefault){
    e.preventDefault();
    }
    e.returnValue = false;
    }
    disableScroll() {
    window.onwheel = this.preventDefault; // modern standard
    window.onmousewheel = document.onmousewheel = this.preventDefault; // older browsers, IE
    window.ontouchmove = this.preventDefault; // mobile
    }
    which should be enabled again via window.___=null in ionViewDidLeave