jQuery Mobile 1.1.0 Final刚刚发布,并承诺:


  “真正的固定工具栏:轻巧,基于CSS且广泛兼容”


他们对于移动浏览器中的solve all position:fixed头痛问题有哪些具体解决方案?

我有一个桌面应用程序(基于Twitter引导程序),该应用程序具有以下位置:固定的工具栏无法在移动浏览器上正常工作?
我想在不包含所有其他功能和CSS jQuery Mobile的情况下合并specifix修复程序。

最佳答案

简单(或多或少):

1)浏览器嗅探以生成黑名单。
2)位置:固定为支持浏览器
3)位置:静止不动

在JQM内查找以下部分:

$ .widget(“ mobile.fixedtoolbar”,$ .mobile.widget,{...}

由于截至目前,许多移动浏览器尚不支持pos:fix,因此在许多浏览器中,您最终都将静态工具栏置于内容的底部!!!

还有一个polyfill可以恢复以前的行为(hide-reposition-show)。

我只是使用此polyfill的一部分来重新定位元素,然后再像这样显示它们:

 el.jqmData("fixed") == "top" ? el.css( "top", $( window ).scrollTop() + "px" ) :
    el.css( "bottom", wrap.outerHeight() - $( window ).scrollTop() - $.mobile.getScreenHeight() + "px" );


如果您的工具栏/元素不必是可见的,则效果很好,因为它是根据设定位置(scroll-stop-recalcualte)进行计算,而不是原始固定工具栏(JQM 1.1之前的版本),它是在滚动(scroll-calculate-scroll-计算),这对设备硬件造成的压力太大,并导致工具栏卡住或跳动。

关于ios - 什么是jQuery Mobile 1.1.0-位置固定方法,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/11050041/

10-14 20:36