Question

我没有这方面的代码，因为这更像是一个概念问题。

我有一个jquery移动页面，其内容顶部有一个部分，我想放在视口上方。我所做的是设置一个相当于此部分高度的silentscroll，这使得窗口滚动到我想要隐藏的部分的正下方。

我现在遇到的问题是，在页面加载和显示的时候，在抛出silentscroll的时候，有一瞬间可以看到要隐藏的部分，这使得页面看起来很麻烦你可以看到静音滚动跳过100和像素来隐藏该部分。这显然是因为在显示页面后执行silentscroll。

有没有办法将scrollTop设置为jquery mobile，以便在显示页面之前执行它，最好是在抛出pagebeforeshow事件时？据我所知，在所有jquery移动小部件初始化之后抛出此事件，因此此时无法在窗口上设置scrollTop？

我要做的是在显示页面之前在窗口上设置scrollTop值，这样用户就不必看到页面跳转了。

我自己无法正确设置，我想知道这是否可能发生。

这是我正在尝试重新创建的设置的快速图像。绿色方块是窗口上方我想要“隐藏”的部分。蓝色框表示移动窗口，灰色框表示文档。

enter image description here

编辑：我检查了移动浏览器; safari在校正silentscroll时没有跳转/抖动。 IOS上的Chrome移动版确实有跳转/抖动，我想知道这是浏览器性能的问题，还是排队DOM /视口变化的方式......

Answer 1

DEMO ：http://jsfiddle.net/gnsj6/

<强> CSS ：

.top {
    height: 200px;
    margin-top: -200px;
}

.container { 
    height: 1000px; 
}

<强>的jQuery ：

$('html, body').animate({
    scrollTop: $("#topedge").offset().top + 200
}, 0, function() {

    $(".top").css("margin-top","0px");

});

我无法注意到这个解决方案的任何跳跃。没有非常庞大的数据（http://jsfiddle.net/gnsj6/4/）

Answer 2

添加隐藏页面的类，在设置滚动顶部后删除该类。

Answer 3

我会说这样的话。隐藏您的body（使用visibility，否则无法滚动）：

....
<body style="visibility:hidden;">....

使用jQuery执行此操作：

$(function(){
    $('body').scrollTop('200px').css('visibility','');

});