-1

I am using this code to scroll to bottom of page when page loads:

$(function(){
 $.mobile.silentScroll(someValue);
}

Using this code I am not able to scroll to bottom of page. What happens is, it scrolls to bottom for a half second and again comes to default position. I am using listview, footers and headers inside body. I have already tried using pageshow, pageload events but not able to get desired result...

Manish
  • 1,946
  • 2
  • 24
  • 36

1 Answers1

1

To understand this you need to understand how jQuery Mobile works.

Some functionalities can't be used with $(function(){, because ta this point page is only loaded into the DOM, jQuery Mobile didn't even started to do anything with that page. To remedy this jQM developers have created something called page events.

Basically $.mobile.silentScroll can only be used during correct page events. But even then you will need to use a settimeout with a slight delay for it to work. Silent Scroll simply wasn't create to be used on a page show.

$(document).on('pageshow', '#index', function(){ 
    setTimeout(function(){
        $.mobile.silentScroll(1500); 
    },100);
});

Working example: http://jsfiddle.net/Gajotres/2xfrM/

In your case page is returning back because page don't have a correct page height during the $(function(){ triggering. Page height is correct only during the pageshow event, but even then you need a slight delay.

Community
  • 1
  • 1
Gajotres
  • 57,309
  • 16
  • 102
  • 130
  • hey thanks your reply helped... but I have to set timeout to 2000, to make this thing work. I also approached in smilar way but never thought of setTimeout, this is kind of "jugad". – Manish Jun 01 '13 at 07:45