jQuery-mobile 1.3 Panel always visible

Question

In the new jQuery-mobile 1.3 version how can be added a left panel that always be visible from the start?

This panel will be act as a navigation menu.

Thanks

Answer 1

There's some things that mess up when using panels as menubar. (yet) If you open the panel this way, it will not work flawless in devices with small widths. It will work, but it's strange cause part of the page is off the screen and has no horizontal scroll. There's no way to navigate in a cellphone with the panel opened and locked as a menubar. (I'm supposing you do not want to use buttons to open and close the panel!) Maybe your target users are only in desktop or larger screen devices. In this case u can use this code, plus data-dismissible="false" AND data-swipe-close="false" in panel tag. But still there's a problem: the ESC key. If the user press the ESC key, the panel will close, and if u have no buttons to open it again, the menu blows! I havent found a way to use panel as menubar yet. If someone did, please help us!

Answer 2

You can open it programatically like this:

$(document).on('pagebeforeshow', '#index', function(){       
    $( "#mypanel" ).panel( "open");
});

And here's a working jsFiddle example: http://jsfiddle.net/Gajotres/EkbYe/