提问人：Andrew G. Johnson 提问时间：6/14/2011 最后编辑：James MontagneAndrew G. Johnson 更新时间：6/14/2011 访问量：392
$（window）.scroll（） 在网站上保留底部栏的方法在 iPhone 上不起作用
$(window).scroll() Method of keeping a bottom bar on a website doesn't work on iPhone
问：
所以，我正在开发一个应该适合移动设备的网站。这个版本的网站被设计成看起来更像是一个iPhone应用程序，因此在屏幕底部有一个栏 http://snpr.cm/kaU9DM.jpg 它需要保持静止。我以前做过这样的事情，简而言之，每当用户滚动时，使用 $（window）.scroll（） 函数来重新定位栏。使用移动 safari，此功能仅在用户完成滚动后触发，效果不佳。我尝试使用touchstart，touchmove和touchend绑定，但它们也不能很好地工作。
有什么建议吗？
答：
0赞
Jonathan.
6/14/2011
#1
这是一个已知问题。您要么必须接受工具栏将被延迟的事实。许多网站都赋予了此类工具栏一种更“浮动”/无依无靠的感觉和外观，以匹配这种行为。
或者，您可以使用元标记设置页面的尺寸，十分之一的屏幕尺寸。然后将内容放在滚动 div 中，并在滚动 div 下方有一个工具栏。因此，当用户滚动时，页面实际上会保持在原位，但占据除底部栏空间之外的所有屏幕的 div 实际上是在滚动的。这似乎是大多数人解决这个问题的方式。然而，更难的是，你不能只在 CSS 中设置一个带有溢出的 div 来滚动，你需要使用类似 iscroll 的东西，否则用户将不得不使用 2 根手指滚动（如果他们意识到他们必须使用 2 根手指，我）
在 ios5 中，将元素的 CSS position 属性设置为 fixed 现在以有意义的方式工作，因此如果您不介意将 iTouch 第 1 代和第 2 代以及 iPhone 原始版和 iPhone 3G 用户抛在身后，您可以使用它。此外，ios5 允许用户使用一根手指滚动元素，而无需任何额外内容。
评论