html - 我无法将位置绝对元素添加到具有滚动的 div 中。有没有可能不引入错误和问题?

标签 html css position

所以我有一个垂直滚动的容器。在这个容器中,我有 x 个输入,如果用户将鼠标悬停在任何输入上,则会在输入的右侧显示一个工具提示。

我看到的问题是滚动容器内的工具提示不能有离开容器的绝对位置。这意味着如果用户滚动到顶部输入,工具提示将在它到达滚动容器的顶部时被切断。

我已经尝试了很多方法,但似乎都无法使此设置正常工作。 Z-index 好像不允许我跳出滚动容器。

抱歉,这不是一个完美的示例,但基本上您可以看到工具提示被限制在滚动容器中: http://cssdeck.com/labs/6aijimdf

预期结果: 我有一个滚动区域,其中有一个绝对定位的元素,当它溢出时会离开滚动区域。

实际结果: 我有一个滚动区域,其中绝对定位的元素在溢出时不能离开滚动区域。

最佳答案

由于工具提示容器是position: relativeoverflow: scrollposition: absolute 元素无法离开它。

我认为实现您的期望的更好方法是使用 javascript 来控制工具提示元素的位置,并为此使用 position: fixed

关于html - 我无法将位置绝对元素添加到具有滚动的 div 中。有没有可能不引入错误和问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57764609/

相关文章:

r - 在构面的第一个情节中的位置图例

javascript - 需要等待setInterval过程完成

jquery - animate.css 动画速度控制

javascript - 缩放内容以始终适合窗口

php - Web 开发/设计实践方法书籍?

html - 使内联 block div 出现在下方而不是重叠

css - 位置:固定和宽度:自动

html - 如何使文本响应?

css - 让谷歌地图 Canvas 使用 100% 剩余高度的最聪明的方法是什么

html - 我有这样的代码 :Dropdown button need to fetch the data which i have entered in input textfield