Question

直截了当;我试图找到一个单词的位置。我使用<a id='' rel=''>标签来添加一些魔法。

JavaScript的：

   function getPosition(element) 
   {
      var xPosition = 0;
      var yPosition = 0;

      while(element) 
      {
          xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
          yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
          element = element.offsetParent;
      }
      return { x: xPosition, y: yPosition };
   }

JavaScript中的HTML部分：

var tooltip = document.createElement("div");
var parentPos = getPosition(link[i]);
tooltip.setAttribute('class', 'object-tooltip');
tooltip.style.border = "solid 1px red";
tooltip.style.color = "black";
tooltip.style.position = "fixed";
tooltip.style.left = parentPos.x+"px";
tooltip.style.padding = "10px";
tooltip.style.backgroundColor = "yellow";
tooltip.style.textDecoration = "none";
tooltip.innerHTML = "<p> test </p>";

当我写这篇文章时，我非常疲惫。第二天早上喝了几十杯咖啡后，我想知道为什么定位不能正常运作。然后我注意到getPosition()正在获取当前元素的位置。问题是测试链接在div块中，而这个div块有六个不同的父节点。另外，我还计划将这些链接放到所有其他div块上。

所以，我希望getPosition()获取整个站点中链接的位置，而不仅仅是当前元素中的位置。我在这里要做的是在悬停链接时获得一个小盒子。悬停部分本身工作正常，但盒子定位不起作用。我自己无法弄清楚： - /

此外，如果您想了解更多细节或其他任何内容，请随时提出！

更新：

JSFiddle与UJC的建议：http://jsfiddle.net/KYt3D/1/

工具提示应该获得光标的位置并转到光标下方。

Answer 1

（不确定这会有所帮助 - 但以防万一）

如果您尝试解决的问题类似于具有工具提示悬停效果，那么这里是一个JSFiddle，它显示了如何根据鼠标的位置（而不是鼠标悬停在元素上的位置））：

使用Event.clientX和Event.clientY

JSFiddle

..希望这可能会有所帮助（ - ！

获取span或div文本的位置

1 个答案: