我的网站上有一些css菜单,用:hover(没有js)扩展
这在iDevices上以半破碎的方式工作,例如点击将激活:hover规则并展开菜单,但是在其他地方点击不会删除:hover.此外,如果元素内部有一个链接,则:hover必须点击两次以激活链接(第一次点击触发:hover,第二次点击触发链接).
通过绑定touchstart事件,我已经能够在iphone上很好地工作了.
问题是,有时移动safari仍然选择:hover从css 而不是我的touchstart事件触发规则!
我知道这是问题,因为当我:hover在css中手动禁用所有规则时,移动safari工作得很好(但是常规浏览器显然不再存在).
有没有办法:hover在用户进行移动旅行时动态"取消" 某些元素的规则？
在这里查看和比较iOS行为:http://jsfiddle.net/74s35/3/ 注意:只有一些css属性会触发双击行为,例如display:none; 但不是背景:红色; 或文字装饰:下划线;
我创建了一个在悬停时生长的盒子.该框中有一个缩略图,它position:absolute比父框大.
当我为父容器的宽度或高度设置动画时,缩略图会被裁剪为父级的大小,但仅限于动画期间.
在这里看一个简单的演示(在mac上测试chrome/safari/ff):http: //jsfiddle.net/Q2BPx/3/
我究竟做错了什么？