javascript - jQuery mobile - panel style removed when loading from any page other than initial one -
i have jquery mobile site 2 pages loaded 1 html file use same panel, in file, outside of data-rol="page" divs. problem when reload second page, in visit before using first page, jquery mobile styling on ul in panel gone.
i've tried adding enhancewithin() code after creating panel must missing something, it's loading same panel, how style lost if reloaded page?
source
<div data-role="page" class="ui-responsive-panel" data-theme="b" id="page"> <div data-role="header" data-position="fixed"> <h1>alpha</h1> <a href="#left-panel" data-icon="bars" data-iconpos="notext">menu</a> </div><!-- /header --> <div data-role="content"> <h1>news , features</h1> <a href="#page2"><p>lorem ipsum</p> </div><!-- /content --> <div data-role="footer" data-position="fixed"> <p>content tbd</p> </div> </div> <div data-role="page" class="ui-responsive-panel" data-theme="b" id="page2"> <div data-role="header" data-position="fixed"> <h1>alpha</h1> <a href="#left-panel" data-icon="bars" data-iconpos="notext">menu</a> </div><!-- /header --> <div data-role="content"> <h1>news , features</h1> <a href="#page"><p>lorem ipsum</p> </div><!-- /content --> <div data-role="footer" data-position="fixed"> <p>content tbd</p> </div> </div>
and script:
<script type="text/javascript"> var panel = '<div data-role="panel" id="left-panel" data-position="right" data-display="push"><h1>panel</h1><ul data-role="listview" data-theme="b"><li><a href="#">test</a></li><li>test2</li></ul></div>'; $(document).one('pagebeforecreate', function () { $.mobile.pagecontainer.prepend(panel); $("#left-panel").panel(); }); </script>
edit: weird explain, if visit first page, id=page
menu loads traditional jquery mobile styling. if navigate second page(id=page"
) after starting on first page, styling fine. if you, on id="page2"
hit 'reload' button on browser style panel gone, , remains gone if navigate id="page"
. unless first page starting point, style never applied, make sense?
Comments
Post a Comment