How to disable "drag" the entire container in iPhone / Chrome

@devwplex wrote:

Hi guys.

I'm facing a renderer trouble with Side Menu. When I run the app in Android and Firefox everything works fine, but when I run in iOS and Chrome I get the follow error / situation: if I click and hold the button (mouse or touch) and drag down and / or up the entire menu content, the interface creates that blank area and it happens in the top and bottom limits. When I release the button (mouse or touch) the interface backs to normal and the blank space disappear.

Take a look at the bellow image (in this case I'm with the mouse's button clicked):

screen_error_002.png708x969 56.5 KB

My current source code is this:

  <ion-side-menu drag-content="false" side="left" width="285" style="width: 285px; z-index: 0;">
    <ion-header-bar class="bar-dark">
    </ion-header-bar>
    <ion-content overflow-scroll="false" drag-content="false" class="dark">
      <ion-list drag-content="false">
          <div class="card lateral">
            <ion-item menu-close href="#/app/linhas/horarios" style="border-bottom-width:0px !important;">
                <img src="img/icon_horarios_menu.png"></img>
                <span class="menuName">Horários</span>
            </ion-item>
            <ion-item menu-close href="#/app/linhas/enderecos" style="border-bottom-width:0px !important;">
                 <img src="img/icon_itinerario_menu.png"></img>
                  <span class="menuName">Itinerários</span>
            </ion-item>
              <ion-item menu-close href="#/app/ondeEstou" style="border-bottom-width:0px !important;">
                 <img src="img/icon_previsao_menu.png"></img>
                  <span class="menuName">Previsão de horários</span>
            </ion-item>
            <ion-item menu-close href="#/app/comoChegar" style="border-bottom-width:0px !important;">
                <img src="img/icon_plano_menu.png"></img>
                <span class="menuName">Como C    hegar</span>
                </ion-item>
                <ion-item menu-close href="#/app/favoritos" style="border-bottom-width:0px !important;">
                      <img src="img/icon_favoritos_menu.png"></img>
                      <span class="menuName">Favoritos</span>
                </ion-item>

                <ion-item menu-close href="#/app/home" style="border-bottom-width:0px !important; border-top-width:1px !important; border-color: #666666 !important;">
                      <img src="img/icon_home.png"></img>
                      <span class="menuName">Home</span>
                </ion-item>
                <ion-item menu-close ng-click="atualizar()" style="border-bottom-width:0px !important;">
                      <img src="img/icon_arrow.png"></img>
                      <span class="menuName">Atualizar dados</span>
                </ion-item>

          </div>

            <div style="text-align: center" ng-include src="'templates/menuDescricao.html'">
             </div>

      </ion-list>
    </ion-content>
  </ion-side-menu>

How can I solve it?

Thanks

Posts: 2

Participants: 1

Read full topic