jQuery Mobile固定页脚滚动文本一次然后在iOS应用程序中停止

我使用jquery-mobile(1.1.1)和Adobe PhoneGap Build创建了一个iOS应用程序。 该应用程序具有固定的页眉和页脚,并且过渡设置为“无”。 页脚包含4个导航按钮,通过javascript导航到应用程序中的四个页面。 我使用了多页模板,因此只有一个HMTL文件。

最初,我使用“data-position:fixed”在页面上定位页眉和页脚,但在页面之间切换时遇到了一些不需要的闪烁和页面跳转。 所以,我转而使用CSS来修改页眉和页脚到屏幕上(如本文所述: https : //github.com/jquery/jquery-mobile/issues/4024 )。 这解决了闪烁的问题,但引入了不同的问题。

问题是: 第一次滚动文本,在任何页面上,页脚随文本一起移动(即它不会保持固定)。 但只是第一次 – 从那时起,每当我滚动文本时,页脚就会保持固定。 为了澄清,这里有几个例子:

例1

  • 打开应用程序,在第一页滚动文本 – 页脚移动。
  • 切换到第二页,滚动文本 – 页脚保持固定。

例2

  • 打开应用程序,切换到第二页而不在第一页上滚动 – 页脚在第二页上移动。
  • 切换回第一页,页脚保持固定。

另外一件事我应该提一下 – 如果我启用了页面转换,那么问题只发生在第一页上。 例如。 如果应用程序加载并且我切换到另一个页面而没有先滚动第一页上的文本,页脚将保持原样应该固定。

任何有关修复此问题的方法的建议都将不胜感激。 谢谢。

我刚刚遇到完全相同的问题,并在应用程序启动时使用以下hack修复它。 请注意,我们在使用Phonegap / Cordova方法手动隐藏初始屏幕之前运行此.js代码段。 这应该防止在用户看到主屏幕之前的任何闪烁/移位。

function fixJqmScrollBug() { window.scrollTo(0, 1); setTimeout(function() { window.scrollTo(0, 0); if( navigator && navigator.splashscreen ) navigator.splashscreen.hide() }, 20); } 

此代码模拟了第一次打破固定页脚的初始滚动,但将其放回默认位置。 我们不得不稍微延迟重新定位回滚动(0,0)以使修复工作 – 因此20ms超时。