scrollTo получает переопределение при использовании jQuery Mobile

Question

Я создаю мобильное веб-приложение с jQuery Mobile и хотел бы скрыть панель поиска над видимой областью. Таким образом, пользователю нужно будет тянуть страницу вниз, чтобы увидеть панель поиска. Я думаю, что лучший способ сделать это - определить панель поиска, как обычно, а затем на загрузку страницы вручную установить положение прокрутки, скажем, 55 пикселей. Вот мой код:

$(document).ready(function() { 
    $("html,body").scrollTop(55); 
} 

Проблема заключается в том, что я могу видеть на обновления страницы он скрыт от глаз, но как только он будет полностью загружен немедленно подскакивает назад к вершине. jQuery Mobile является виновником, поскольку это не происходит с этим простым JS Fiddle.

Как остановить JQM от переопределения моего набора scrollTop, или мне нужно реализовать его по-другому?

Answer 1

jQuery Mobile имеет специальную функцию прокрутки $.mobile.silentScroll(). Он прокручивается без анимации, но в то же время он не вызывает событие scroll.

Вам также нужно подождать, пока страница полностью загрузится в DOM перед вызовом этой функции. Вы можете привязать его к pagebeforeshow или pageshow.

$(document).on("pagebeforeshow", "#page", function() { 
    setTimeout(function() { 
     $.mobile.silentScroll(100); 
    }, 10); 
}); 

Demo