如何在悬停之前触发css过渡

Question

所以，我隐藏了侧边栏并在鼠标悬停时显示出来。我的问题是如何在鼠标悬停在侧边栏之前触发 css 转换，就像在这个侧边栏链接中一样：https://la24.org/vision。我该怎么做？非常感谢

Answer 1

有两种方法。

1. Javascript - 只需在需要时切换扩展类。
2. 纯 CSS - Sideabar Wrapper and Sidebar element

在这种情况下，您可以在 .sidebar-wrapper 悬停时触发 .sidebar 动画：

.sidebar-wrapper:hover > .sidebar{
   **Your hover state** (e.g. width: 300px)
}