html5 - JQuery Mobile event on Page Load -
i'm using code animate collapsible content in html5+jqurymobile app...i add head:
$(document).on('expand', '.ui-collapsible', function() { $(this).children().next().hide(); $(this).children().next().slidedown(500); }) $(document).on('collapse', '.ui-collapsible', function() { $(this).children().next().slideup(500); });
it works fine when click on collapsible head...i'd use collapsible elements in pages i'd have animation automatically after page loaded... 1 can me?!?
working example: http://jsfiddle.net/gajotres/vmzyn/
$(document).on('pageshow', '#index', function(){ $('.ui-collapsible').children().next().hide(); $('.ui-collapsible').children().next().slidedown(1500); });
you want use pageshow event. @ point page can animate sliding.
in case want 1 (like document ready) use syntax instead:
$(document).on('pageinit', '#index', function(){ $('.ui-collapsible').children().next().hide(); $('.ui-collapsible').children().next().slidedown(1500); });
unlike pageshow, pageinit trigger once.
Comments
Post a Comment