我有一些CSS按钮。 “按钮”效果是通过在锚标记中具有固定大小的<span>
元素来完成的,并且css以a span:active
,a span:hover
的风格来规则以显示按钮状态。
这些按钮用于分页,因此当您在第1页时,“上一个”按钮被禁用,当您在最后一页时,“下一个”按钮被禁用。这在jQuery中得到了适当的强制执行。但...
问题
首先,这是一个小提琴 http://jsfiddle.net/9Y2uj/6/
在Firefox中,一切都很棒,除非你点击一个按钮,不要松开鼠标,然后拖出,按钮保持按下状态。这不是什么大问题,但令人讨厌。我认为这种行为是记录在案的。
在IE和Chrome中,它崩溃并灼伤。我的问题是如何在IE和Chrome中使用?更具体地说,我使用的哪些CSS属性不兼容浏览器兼容?这是基于{ {1}}和:active
(编辑我也忘了:不是)我不知道的假选择器有任何跨浏览器兼容性问题。
以下是IE和Chrome中出现问题的说明。如果在以下段落中有任何不清楚或未解释的内容,请在FF中查看以查看正确的行为,然后在Chrome和IE中查看其中的内容。
在Chrome中,按钮在整个页面视图中保持按下状态,直到它变为非活动状态。并且,对于CSS pruposes,完全忽略“活动”“非活动”按钮逻辑。对于JS,它正确地避免使用最后一页上的下一个按钮和第一页上的上一个按钮,但是......出于显示目的,我让JS添加一个名为:hover
的类,其上有不透明度设置。我检查了元素以验证是否添加了类,但我看不到不透明度。
在IE中,永远不会触发disabled
事件。仅观察到:active
,忽略:hover
。但是,有趣的是,“非活动”按钮规则已正确执行!
感谢阅读!
答案 0 :(得分:0)
选择器
a#leftButton:not(.disabled):hover span
可能不是交叉兼容的。我只是在猜测。