我有一个带有 overflow:hidden 的滚动 Pane div。请查看here .滚动 Pane 中显示带有标题的图像形式的产品。当我将鼠标光标移到产品 div 上时,它会变成浅黄色背景并更改其高度 - 我只是使用 jQuery 向 div 添加了一个类,它工作正常。我需要以某种方式解决的问题是将事件产品的扩展 div 显示为显示在滚动 Pane 上方的单独 div,尽管现在它出现在该 Pane 内并在其高度上扩展它。我想让它看起来类似于 this one .在这里,您将鼠标光标移到产品上,并获得一个显示详细信息的扩展 div。当然,由于那个滚动 Pane ,我的任务有点困难。
最佳答案
如果使用 .offset() method 应该不会太难悬停在 .product
上.您可以执行以下操作:
- 在你的
.product
悬停事件处理程序,获取产品的偏移量。这将为您提供产品相对于文档的位置。 - 接下来创建您的叠加产品信息 div 并将其直接附加到
<body>
. - 将 overlay div 设置为 position: absolute 并使用从 offset 调用返回的值来定位它。
- 最后确保您的叠加层具有比滚动 Pane 更高的 z-index,您应该可以正常工作。
关于javascript - CSS 在 div 上方显示事件元素并溢出 :hidden,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3513575/