<!--********* HOME *************--> <div data-role="page" id="home"> <div data-role="content"> ..... </div> <div data-role="footer" data-position="fixed" id="footer"> <a href="#menu" data-role="button" dataicon="home" data-transition="fade" id="credits"> </a> </div> </div> <!--********* HOME *************--> <!--********* MENU *************--> <div data-role="page" id="home"> <div data-role="content"> ..... </div> <div data-role="footer" data-position="fixed" id="footer"> <a href="#menu" data-role="button" dataicon="home" data-transition="fade" id="credits"> </a> </div> </div> <!--********* MENU *************-->
and so on...
in some pages i implement some animations...like the auto open for collapsible element
$(document).on('pageshow', '#mostra_menu, #regina_menu, #cultura_menu, #restauro_menu', function(){ $('.ui-collapsible').children().next().hide(); $('.ui-collapsible').children().next().slideDown(300); });
this works graet...the problem is that when i reload the same page - #mostra_menu,... - the collapsible is still opened...
same problem in other pages where i have an animated .gif...when i load for the first time the page the animation starts normally...if i navigae the app and then reload the page with the .gif the animation doesn't start...
i think the problem is in the multi-page html...it is loaded one time...so all the pages revisited aren't reloaded...
how i can fix?!