Javascript 使用jQuery悬停时工具提示的CSS动态位置

我正在编写一个可以保存HTML标记的简单工具提示。请查看演示

---

我希望无论元素的位置如何，工具提示框都能正确显示，在本例中，您可以使用文档宽度检查html文档的宽度，并相应地调整左侧位置。说：

    //set  the left position
    var left = $(this).offset().left + 10;
    if(left + 200 > $(document).width()){
        left = $(document).width() - 200;   
    }

我在这里使用了200，因为您正在将工具提示设置为200px宽。高度也可以做类似的事情

也有一个窗口宽度，但我总是混淆的差异，所以你应该检查哪一个给你更好的结果

页面底部的一个示例是：

   //set the height, top position
    var height = $(this).height();
    var top = $(this).offset().top;
    if(top + 200 > $(window).height()){
        top = $(window).height() - 200 - height;
    }

再次使用200，因为您正在将工具提示设置为200px高度。

$（'a.show-tooltips'）。鼠标悬停（函数（）{

如果（$（this.parent（））.css（'float'））=“right”）将适当的类添加到左侧

else->正确的类 ....

---

}

如果右侧没有窗口空间，是否要将工具提示向左翻转，@Narazana您可以采用与左侧类似的方式进行操作。而是使用height（）函数。我将用一个例子来编辑答案。谢谢，维森特。我终于做到了。我刚刚更新了问题，包括@VincentRamdhanie的最新更新演示亲爱的Vincent Ramdhanie你能检查我的问题吗。