固定移动浏览器的定位

时间:2010-07-30 15:34:09

标签: javascript html css mobile-website

在我正在建设的移动网站上,我需要顶部标题保持固定位置。

我知道Mobile Safari的固定位置解决方案,如下所示:

http://doctyper.com/archives/200808/fixed-positioning-on-mobile-safari/

我试了一下,效果很好。但是,我想知道是否有适用于所有主要智能手机移动浏览器的单一解决方案。注意:我不需要页脚保持固定,只需要顶部标题。因此,这应该可以更容易地适应所有移动屏幕尺寸,因为我只是将div的顶部设置为0 onScroll。

谢谢!

3 个答案:

答案 0 :(得分:6)

重要更新

从iOS 5开始,固定定位在移动设备上运行良好。同样最新的机器人也支持它。


旧答案

我认为iScroll是最积极开发的解决方案,它确实支持Android

但有几点需要注意:

  1. 通过启用此黑客,您将禁用人们习惯喜欢缩放的功能。
  2. 这为您的解决方案增加了很多复杂性。
  3. 由于这些原因,JQtouch决定not to use it

      

    不是问题。它目前不是   jQTouch支持。不确定如何   熟悉你,但主要问题   这是移动Safari没有   支持位置:固定。一些人   已经致力于实施   这一点,最值得注意的是   Cubiq    和   Doctyper。   我都觉得不对劲,   因此,为什么我默认不做,但是   你可以自由地尝试制作一个   支持它的扩展 -

    就个人处理iPhone上需要固定定位的东西而言,我更喜欢静态定位,并且在动态更改内容时只需自动滚动到底部/顶部。

答案 1 :(得分:2)

我在两周多的时间里遇到了同样的问题。这个解决方案对我有用。只需加入

-webkit-backface-visibility:hidden;

在元素的css中以及position:fixed。

它会正常工作

答案 2 :(得分:0)

继Sam Saffron发布的链接之后,似乎新版本的iScroll(版本4)已经解决了Sam列出的一些问题。

iScroll-4

  

除了之前的所有iScroll功能外,版本4还介绍了:

     
      
  • 捏/缩放
  •   
  • 向上/向下拉动以刷新
  •   
  • 提高速度和动力
  •   
  • 对齐元素
  •   
  • 可自定义的滚动条
  •   

我只看了他们网站上的演示,所以我不能担保,但它看起来不错!

相关问题