我有宽度为 100% 的 div 容器。我需要根据容器中的鼠标悬停来隐藏和显示内容。但这需要在主容器左侧的 30% 和其余（70%）处发生，没有显示/隐藏效果。我们可以在不添加任何额外的子容器的情况下做出这种效果吗？
图像表示
这个效果怎么做？
问问题
100 次
2 回答
2
这个 Fiddle说明了一个非常基本的解决方案；每次鼠标在 30% 内移动时它都会调用效果，因此您可能需要添加一些进一步的逻辑来防止这种情况发生。
我使用了一个 500px 宽度的容器和一个子容器 div，但仅用于说明目的；JavaScript 将管理任何宽度的单个容器。您需要为“widthModifier”变量添加任何定位、边距或填充，但如果您愿意，也可以从 JavaScript 中的容器中获取它们。
于 2012-09-26T13:03:23.290 回答
0
丹尼尔的回答并没有解决显示和隐藏内容的问题。看看我的解决方案，它完全符合您的要求。我使用 CSS 特性来实现结果。
使用 Chrome 查看示例。对于其他浏览器，您只需添加它们对 css 功能的特定实现。
于 2012-09-26T14:03:14.967 回答