是否有可能强制忽略:hover pseudoclass为iPhone/iPad用户?

我有一些css菜单在我的网站上扩展:hover(没有js)

这在iDevices上以半破坏的方式工作,例如轻击将激活:hover规则并展开菜单,但是在其他地方点击不会删除:hover。此外,如果元素中有一个链接:hover’ed,你必须点击两次激活链接(第一次触发:悬停,第二次触发链接)。

我已经能够通过绑定touchstart事件使事情在iPhone上很好地工作。

问题是,有时移动safari仍然选择触发:悬停规则从CSS而不是我的touchstart事件!

我知道这是问题,因为当我禁用所有:悬停规则手动在CSS,移动safari工作伟大(但常规浏览器显然不再)。

有一种方法来动态“取消”:当用户在移动safari时,悬停某些元素的规则?

在这里查看和比较iOS的行为:http://jsfiddle.net/74s35/3/
注意:只有一些css属性触发双击行为,例如。 display:none;但不是背景:红色;或文本装饰:下划线;

解决方法

我发现“:hover”在iPhone / iPad Safari中是不可预测的。有时,点击元素使该元素“:hover”,有时它漂移到其他元素。

目前,我只是在身体有一个“没有触摸”的类。

<body class="yui3-skin-sam no-touch">
   ...
</body>

并且所有的CSS规则与“:hover”下面的“.no-touch”:

.no-touch my:hover{
   color: red;
}

页面中的某处,我有javascript从身体删除不接触类。

if ('ontouchstart' in document) {
    Y.one('body').removeClass('no-touch');
}

这看起来不太完美,但它仍然工作。

相关文章

UITabBarController 是 iOS 中用于管理和显示选项卡界面的一...
UITableView的重用机制避免了频繁创建和销毁单元格的开销,使...
Objective-C中,类的实例变量(instance variables)和属性(...
从内存管理的角度来看,block可以作为方法的传入参数是因为b...
WKWebView 是 iOS 开发中用于显示网页内容的组件,它是在 iO...
OC中常用的多线程编程技术: 1. NSThread NSThread是Objecti...