jQuery Mobile: Page scrolls down after transition -
i'm navigating page 1 page 2 in jquery mobile site using $.mobile.changepage()
method. both page 1 , page 2 larger screen, though page 1 longer page 2
page 1 long list of items. when user taps item, load content page 2 via ajax, append content body, , transition page 2 using changepage()
.
if user scrolls down list on page 1, , transitions page 2, window scrolls down variable amount on page 2. add distance scrolled on page 2 seems related distance user scrolled on page 1.
i have tried using $.mobile.silentscroll(0);
, $('body').scrolltop('0');
haven't had success.
how can go preventing change page method scrolling down on page 2
i've encountered same issue before. can create event handler invoked whenever there page change , have function scroll top of page:
$.mobile.pagecontainer.on("pagecontainerchange", function(event, ui) { $(document).scrolltop(0); });
the key difference here performing .scrolltop()
on document
instead of body
.
in code i've made small example bit more sophisticated. record vertical scroll position of each page, store on page dom element, , restore vertical scroll position when user returns page. way user returned left off instead of being scrolled top of page.
Comments
Post a Comment