Framework7 side panel can't close when tap on outside

[Arthur_T_]

Step to repeat:

- create a new project as Standard HTML5 application using App Designer and Framework7

- create 2 buttons, 1 left sidebar by drag the control on the page

- 1 button will open left sidebar, 1 button will prompt an alert

After I build the app and deploy to iPhone, it can open the left sidebar by click on the button. But can't default close it when tap outside the sidebar. Instead, it handle my tap on button script too so the alert prompt when I tap on the button. No different for

var myApp = new Framework7({
   panelsCloseByOutside: true
});

Anything wrong?

P.S. I'm using Intel XDK ver3240 run on iMac OSX El Capitan. iPhone 6s

[Elroy_A_Intel]

This seems to be an issue in regards to the functionality of the framework and the App Designer tool. I have escalated this issue to the App Designer engineering team.

[Brian_W_Intel]

If you add the following as a direct child of the body tag, you should achieve the functionality you want:

<div class="panel-overlay"></div>

[Arthur_T_]

Thanks Brian, it works. So it is XDK issue as missing that code.

[Chris_P_Intel]

We have a feature planned for the future so that users of F7 can elect the overlay or not. Presently, it is not included and users must add it manually. 

[Arthur_T_]

Understood, thanks Chris.

[Andrejs_V_]

It is a little error in XDK

for F7 You should add class "close-panel" for closing panel element , example - button on slide panel