Question

我使用了这个工具提示：

var tooltip = d3.select("#d3tooltip")
    .append("div")
    .style("position", "absolute")
    .style("z-index", "10")
    .style("visibility", "hidden")
    .text("a simple tooltip");

我的HTML：

<div id="d3">
<div id="d3tooltip"></div>
<div id="d3present"></div>
</div>

svg被附加到'div＃d3present'。当一个节点被鼠标移过时，tootip显示在节点旁边。它在一个html中工作正常。

但是，当我将其渲染到对话框中时，工具提示不再接近节点，事实上，它会向下运行到对话框的底部。

我一整天都在努力，任何帮助都将受到赞赏！

Answer 1

＆lt; div id =“d3”＆gt;的css样式是什么？标记

当浏览器呈现“position：absolute”元素时，它会找到元素的第一个父元素，其位置不是静态的，这意味着相对/绝对或固定，直到body，然后将元素呈现给该元素。< / p>

默认情况下，每个元素的position属性都是静态的。

因此，如果你的＃d3标签没有相对位置或绝对位置，并且模态对话框具有绝对或固定位置，那么浏览器将呈现相对于该位置的工具提示。

您可以查看工具提示父位置设置吗？

为什么我的工具提示处于错误的位置？

1 个答案: