I am trying to create a burger/staple style menu in Enyo where I have one panel that holds the content and another that holds my menu to the left. When the user presses a button I want the menu on the left to slide in over the content but only half way.
At the minute the panel always takes up 100% of the width and thus covers all my content panel, when I only want to cover half of it. I am using a CollapsingArranger with one App.js panel and then adding the panels to that one main panel.
I have tried width 50% and z indexes but I cannot get it to work. Is Panels the best approach for this? Is there a good example of this behaviour available as an example?
0 ·
Comments
Secondly I want it to be possible to bring a menu in from the left and also one in from the right. So I think I have to go back to looking at the arrangers?
http://jsfiddle.net/dzWL3/
When selecting the existing menu item the menu just closes, but when you select a different item it fully open the menu, swaps the content and then closes. Just noticed it needs to be updated so that it also works on drag and not just tap.
However I can slide the panel out of view and this doesn't set the value of showing to false for the panel so clicking the button doesn't open it next time around.
I need to be able to tell when the panel has been closed fully, is this possible?
http://jsfiddle.net/dzWL3/1/