工具提示通过包含HTML元素隐藏

Question

我有一个图表，该图表位于已设置为overflow-y: scroll的div中。工具提示会从图表的右侧溢出，并且看不到其中的一部分。

显然，CSS不允许同时使用overflow-y: scroll和overflow-x: visible，因此工具提示变得晦涩难懂。日历也有同样的问题，但是它的设置可以更改其展开方向。

有没有一种方法可以重新定位或偏移工具提示，使它们向左扩展？

这是一张图片...

我以为这种破解是可行的，但是它导致包含图表的div变得可以水平滚动。

https://stackoverflow.com/a/39554003/221683

Answer 1

如果要显示更大的区域，工具提示应该在oveflow框之外。您可以在鼠标悬停或任何其他操作上计算其在js中的位置-无需代码，我不知道您所显示的内容，方式以及为什么它无法如您所描述的那样工作。 “代码可以正常工作”-如果您提出问题，显然就不行了……

<style>
.container { position:relative; }
.tooltip { position:absolute; }
</style>

<div class='container'>
    <div class='tooltip'>Hi mum, this is long as hell tooltip, not overflowed</div>
    <div class='chart'>
    ... chart data
    </div>
</div>