iPhone / iOS / Safari不会更改display:none to display:block using:hover

时间:2014-03-04 19:21:26

标签: html ios css iphone

我正在开发一种具有固定图层的响应式设计,以保持标题浮动在页面顶部。使用:hover和元素悬停时应显示菜单和其他信息 - 因此显示从无变为阻塞。

有谁知道为什么Safari无法在iPhone上正常运行?我已经测试了我可以访问的其他设备/浏览器没有任何问题。还有其他工作吗?也许使用Javascript?

链接是: http://www.surfbagel.com/new/master.htm

感谢您的时间和帮助!

约翰

3 个答案:

答案 0 :(得分:1)

这里的问题是移动版Safari有no concept of a hover。如果你考虑一下,你怎么能用触摸设备盘旋?使用鼠标可以很容易,因为当您移动鼠标时不会发出咔嗒声,但使用Touch时,只要触摸屏幕就会立即执行操作。

答案 1 :(得分:1)

你不能用iPhone徘徊。您可以尝试使用:active而不是:hover。

在你的情况下:对于菜单,你必须在菜单中添加一个类,并将Javascript从活动状态更改为非活动状态,此类的css将其从显示更改为:none display:block

答案 2 :(得分:1)

在移动设备中,您没有:hoverhover概念不存在。这就是为什么在iPhone中不起作用。