How to create External Panels in jQuery mobile? -


i trying create multi page application , using jquery mobile, have couple of panels using jquery mobile:

<div data-role="panel" id="left-panel" data-theme="b" data-display="overlay"></div> <div data-role="panel" id="right-panel" data-display="overlay" data-position="right" data-theme="b"></div> 

however, cumbersome add these panels every page create. need in using these panels in pages i'm create. in advance!

this script worked me

$(document).on("pagecreate", ".demo-page", function() { var panell = '<div data-role="panel" id="left-panel" data-position="left" data-display="reveal" data-theme="a"><ul data-role="listview" data-inset="true"><li><a href="index.html" data-transition="slide">home</a></li><li><a href="bio.html" data-transition="slide">about</a></li><li><a href="news.html" data-transition="slide">news</a></li></ul></div>'; $.mobile.pagecontainer.prepend(panell); $("#left-panel").panel().enhancewithin();  var panelr = '<div data-role="panel" id="right-panel" data-position="right" data-display="reveal" data-theme="a"><ul data-role="listview" data-inset="true"><li><a href="index.html" data-transition="slide">home</a></li><li><a href="bio.html" data-transition="slide">about</a></li><li><a href="news.html" data-transition="slide">news</a></li></ul></div>'; $.mobile.pagecontainer.prepend(panelr); $("#right-panel").panel().enhancewithin(); }); 

Comments

Popular posts from this blog

java - Could not locate OpenAL library -

c++ - Delete matches in OpenCV (Keypoints and descriptors) -

sorting - opencl Bitonic sort with 64 bits keys -