在IE上组合了活动状态伪类和相邻元素选择器

Active state pseudo class and Adjacent element selector combined on IE

本文关键字:元素 选择器 IE 组合 活动状态      更新时间:2023-09-26

我目前在IE上有一个问题- http://jsbin.com/riyaxewo/4

<div class="a">
  1
</div>
<div class="b">
  2
</div>
CSS

.a, .b {
  height: 50px;
  width: 50px;
  padding: 10px 10px;
  border: 1px solid;
  text-align: center;
}
.a:active, .b:active {
  background-color: red;
}
.a:hover + .b {
  background-color: transparent;
}
.a:active + .b {
  background-color: yellow;
}

当框#1被按下时,预期的结果是框#2是黄色的,然而,在IE上效果只发生一次,然后就不会再发生了。

我在CSS中这样做而不是编程的原因是因为我希望只要鼠标按在元素上就会发生效果,即使鼠标按钮在其他地方被释放(这意味着我不能依赖mouseup, mouseleave/mouseout不会让我得到想要的结果)

希望对您有所帮助:https://stackoverflow.com/a/17211251/3884420

显然是IE中的一个bug,对于活动元素的子元素和类似的东西也是如此。你可以尝试一个js脚本,使用on mousedown和on mouseup触发器。我知道你说过你不能。

在测试你的问题时还发生了更有趣的事情。如果你试着在鼠标处于活动状态时离开它,它每次都会工作。我删除了你添加的悬停属性,甚至这个停止工作。我猜每次你的鼠标离开并且悬停效果停止时,活动效果就会再次启动。