Splitter menus bug



  • Hello,
    I have 2 splitter menus on left and right sides.
    One is collapsed and swipeable, the other is not.
    But the swipe does not work properly: the content is not grayed out, and the menu does not collapse if I tap outside.

    Here is the code:

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="UTF-8">
        <title>Bug Splitters</title>
        <link rel='stylesheet prefetch' href='https://unpkg.com/onsenui/css/onsenui.css'>
        <link rel='stylesheet prefetch' href='https://unpkg.com/onsenui/css/onsen-css-components.css'>
      </head>
      <body>
      <ons-splitter>
        <ons-splitter-side side="left" width="220px" collapse swipeable>
          <ons-page>
            <ons-list>
              <ons-list-item>Left</ons-list-item>
            </ons-list>
          </ons-page>
        </ons-splitter-side>
        <ons-splitter-side side="right" width="220px" >
          <ons-page>
            <ons-list>
              <ons-list-item>Right</ons-list-item>
            </ons-list>
          </ons-page>
        </ons-splitter-side>
        <ons-splitter-content>
          <ons-page>
            <p style="text-align: center;">
              Swipe right to open the menu!
            </p>
          </ons-page>
        </ons-splitter-content>
      </ons-splitter>
      <script src='https://unpkg.com/onsenui/js/onsenui.js'></script>
    </body>
    </html>
    
    


  • @Rork So I have been playing with this and confirmed your behavior. You can swipe open and close the left menu, but (once you add the second menu) you lose the graying out and the cancelable action of tapping outside the menu. You might want to open a github ticket on this.




  • Onsen UI

    @Rork I just made a PR that should fix it :smile: thanks for reporting and sorry for the delay.


Log in to reply