3

我正在尝试触发其他一些按钮（项目）以object7:hover从“添加”按钮 ( object7) 滚动，但它似乎无论如何都不会触发它。我试图避免使用 JavaScript，只使用 HTML 和 CSS。我得到的代码可以在这里找到

有什么建议么？

编辑：也许我不够清楚，这应该是这样的：

用户悬停“设置”=>所有项目从“设置”后面滑动=>用户悬停“添加”=>

=> 项目从“添加”按钮后面向下滑动

4

1 回答 1

1

我相信您的问题是按钮不会响应悬停事件。

如果您改用跨度，它似乎可以工作。这是一个演示的小提琴。我没有费心将所有元素正确排列，但是当您将鼠标悬停在“添加”跨度上时，您可以看到“新”跨度移动，我相信这就是您正在努力实现的目标。

<div class="container">
<span class="set">
    <span class="object1">Start</span >
    <span class="object2">Stop</span >
    <span class="object3">Play</span >
    <span class="object4">Pause</span >
    <span class="object5">More</span >
    <span class="object6">Info</span >
    <span class="object7">Add
         <span class="object8">New</span >       
    </span >
    <span class="default">Settings</span >
    </span>
</div>

编辑： div 元素也可以工作，可能其他人也可以。似乎按钮元素可能是问题所在？不确定，因为谷歌搜索意味着任何元素对于悬停伪选择器都是有效的，但该按钮在我的 Chrome 版本中肯定不起作用。

于 2012-10-19T16:03:46.467 回答