将鼠标悬停在子元素上，更改父级的CSS？

Question

我正在使用ZeroClipboard复制到剪贴板。这会在我的元素上放置一个不可见的flash影片，这样就可以访问用户剪贴板了。

我在使用CSS时遇到了麻烦。

我有一个列表，其元素如下：

<li>
    <div class="btn-holder">
      <div class="clipboard">copy to clipboard</div>
    </div>
</li>

这是CSS（SASS）：

li{
    &:hover .btn-holder{
        opacity: 1;
    }
}

.btn-holder{
    opacity: 0;
}

当您将鼠标悬停在li元素上时，它的子.btn-holder元素会淡入。

我遇到的问题是，当用户将鼠标悬停在flash影片上时（这是使用.clipboard类的div），将鼠标悬停在li元素上会失败并且.btn-holder淡出。

ZeroClipboard已经预料到这一点，并在元素悬停时添加了一个类，所以在悬停时.clipboard会有一个类：

zeroclipboard-is-hover

如何将其添加到CSS中，以便在.clipboard上存在此类时，.btn-holder不会淡出？

Answer 1

CSS（或SCSS）目前无法选择父元素。您必须通过JS通过.parent()方法执行此操作，并添加一个模仿您的悬停状态的活动类。