Question

我正在尝试用CSS制作旋转木马。我有一个图像滑块，每个图像链接到另一个页面。它看起来很棒，但我想添加控件。我在图像滑块下面制作了“按钮”，我将它们设置为动画，与滑块同步点亮（第一个按钮在第一个图像滑入时亮起，等等）。有没有什么办法可以通过创建一个暂停其他按钮和滑块动画的悬停语句来使每个按钮都起作用？我想更重要的是，我可以制作一个点击语句，使图像滑块跳到动画中的适当位置吗？

Answer 1

简短的回答是：不。这是不可能的。

你所看到的东西不存在：你需要一个：has - selector。

<div id="container">
  <span id="content">content</span>
  <span>id="button">button</span>
</div>

<!-- non-functional css -->
#container:has(#button:hover) > #content
{
    background-color:red; <!-- or: stop animation -->
}

has-selector DOES存在是JQuery（http://api.jquery.com/has-selector/），可能会在未来的css版本中实现。它悬停不包含在css3中。它似乎包含在css4中： http://dev.w3.org/csswg/selectors/#has-pseudo

CSS3：是否可以在元素悬停时暂停其他元素的动画？

1 个答案: