Ion-side-menu vs ion-scroll

ionic-v1
1

I am currently experiencing an issue with my app where the dragging of the slide-menu-content fails because I have the ion-scroll (direction y - vertical)

<ion-side-menus>
  <ion-side-menu-content>
    <ion-scroll direction="y">
      <ion-refresher on-refresh=""></ion-refresher>
      <ion-list class="posts">
        <ion-item>item</ion-item>
        <ion-item>item</ion-item>
      </ion-list>
    </ion-scroll>
  </ion-side-menu-content>
  <ion-side-menu side="right">
    <p>something</p>
  </ion-side-menu>
</ion-side-menus>

The dragging to reveal the side-menu works if I remove the ion-scroll. Has anyone experienced this too, and is there a fix I can apply

2

Please, any help on this will be very much appreciated

3

Can you please put together a codepen demoing this?

4

Thanks for the response, here is the issue replicated on codepen

5

Hi @mhartington, any ideas as to what is causing the issue?

6

I’m not an expert here, but my guess is that the gesture has to be on the pane, and the scrollview i filling the whole pane preventing you from actually “touching” the pane… If you set the scroll to lets say 95% width thus manking som room where you can touch the pane it will work…

See the Pen NPdmMN by Toke Refstrup (@icedice) on CodePen.

Another option is to create some kind of header with a button that unhides the sidemenu by calling a method on the scope...
7

If you just vertical scroll, why just use ion-content?

ion-scroll is for more specialized cases (zooming, nested scrolls, etc).

1 Like
8

Just what the doctor ordered. Working perfectly

Thank you very much sir!