Question

我目前在IE上遇到此问题 - http://jsbin.com/riyaxewo/4

HTML

<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中这样做而不是以编程方式执行此操作的原因是因为我希望只要在元素上按下鼠标就会发生效果，即使鼠标按钮已在其他地方释放（意味着我可以＆＃39; t依赖于mouseup，mouseleave/mouseout不会得到想要的结果）

Answer 1

希望这会有所帮助：https://stackoverflow.com/a/17211251/3884420

显然它是IE中的一个错误，对于活跃元素的孩子来说也是如此。你可以尝试在mousedown和mouseup触发器上使用的js脚本。我知道你说你不能。

在测试你的问题时，还有一些更有趣的事情发生了。如果你试图在活动时离开你的鼠标，它每次都有效。我删除了你添加的悬停属性，甚至停止了工作。我猜你每次鼠标离开和悬停效果停止时，主动效果再次激发。

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

1 个答案: