繁体   English   中英

创建一个适用于iOS Safari的“粘性”固定位置项

[英]Creating a “sticky” fixed-position item that works on iOS Safari

在iOS Safari中,单指平移在用户停止平移之前不会生成任何事件。 仅当页面停止移动并重新绘制时才会生成onscroll事件。

我需要一种方法来检测实时滚动。 具体来说,我想制作一个也适用于iOS Safari的粘性菜单。 在非移动浏览器上,粘贴菜单可以通过在听取onscroll事件时在元素上的“position relative”到“position fixed”之间切换来完成。 此方法不适用于移动浏览器,因为不会连续触发onscroll事件。 我能做什么?

回答我自己的问题。 iOS7现在支持位置:粘性演示: http ://html5-demos.appspot.com/static/css/sticky.html

我最近花了很多时间试图为同样的问题找到一个实用的解决方案。 没有正确的方法可以做到这一点,虽然有一些不错的黑客(大多数已经提到)。 问题是JavaScript在用户滚动时暂停。 当你考虑其含义时,这是有道理的,但这使得实现固定定位元素变得非常困难。

我能找到的最好的东西就是谷歌人们的这篇精彩文章。 您可以在移动safari中查看http://gmail.com以查看它的实际效果。

https://developers.google.com/mobile/articles/webapp_fixed_ui

希望这可以帮助。

我有一个类似的问题,绑定处理程序touchstart / touchmove / touchend使用jquery来检测单指滚动,它完美地工作。 在我的情况下,我需要移动另一个元素与尝试移动另一个元素相同的数量,并且它在尝试滚动时很好地更新,因此它应该适合您的要求。

如果你想要的只是一个粘性菜单,你可以通过使用现有的库来节省一些麻烦。 我在iScroll上取得了成功:

http://cubiq.org/iscroll

至少,你可以看看它是如何工作的,并以此为基础构建你的解决方案。

快乐的黑客!

老话题肯定,但我可以在这里看到很多访问。 如果你想要的只是一个粘性菜单,你可以使用固定定位。 那里不需要iScroll。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM