使用具有溢出滚动和Z-Index的工具提示 [英] Using a Tooltip with Overflow Scroll and Z-Index

问题描述

在我正在创建的网站中，我有一个用于目录的侧边栏。当悬停节点时，我显示工具提示。我有溢出设置滚动为了保持在他们的容器中的目录。我需要我的工具提示弹出容器溢出：隐藏。我尝试设置z-index高于其他元素，但它仍然隐藏工具提示。试图张贴图片，但我需要更高的声誉第一。

In a site I'm creating, I have a sidebar for directories. When hovering a node, I display a tooltip. I have the overflow set to scroll in order to keep the directories in their container. I need my tooltip to pop out of the container with overflow:hidden. I tried setting the z-index higher than the other elements, but it is still hiding the tooltip. Tried to post pictures, but I need a higher reputation first. Does anyone have a suggestion for this issue?

推荐答案

修复此处 - http://jsfiddle.net/3w6kznac/2/

不要设置项目的相对位置（附有悬停事件）

Do not set relative position of the item (to which hovering event is attached)

.tooltip{
        display: inline;
        /*position: relative; */ // remove this
}

这篇关于使用具有溢出滚动和Z-Index的工具提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！