0

我有以下代码；

var posLeft = 170;
var posDown = e.pageY;

    $(this).next().css({'top':posDown, 'left':posLeft, 'position':'absolute'}).toggleClass('is-hidden');
});

和 HTML

<tr>
    <td><a href="#">123</a>
        <div class="pop-up is-hidden">
            <p>Type:<span>Code</span></p>
            <p>Number:<span>123</span></p>
            <p>Status:<span>Valid</span></p>
            <p>Sold In:<span>August</span></p>
            <p>Uploaded:<span>20/09/2012 10:34</span></p>
        </div>
    </td>
    <td>Code</td>
    <td>Valid</td>
    <td>Device is active</td>
</tr>

jQuery.pop-up在悬停时显示 div，我遇到的问题是.pop-up. 它正确地坐在左边，但垂直定位不正确。我认为使用 pageY 将 div 相对于文档定位，当我希望它定位在锚点上时。

该表没有应用任何定位，因此我需要帮助以获取最佳方法以.pop-up使其出现在正确的位置。

提前致谢。

4

2 回答 2

1

你的意思是像这个FIDDLE吗？

$("a.tooltip").mouseenter(function(e) {
    tooltip = $(this).parent().find(".is-hidden");
    tooltip
        .css("top",(e.pageY) + "px")
        .css("z-index","200002")
        .css("left",(e.pageX) + "px");

    tooltip.show();
}).mouseleave(function(e) {
    tooltip = $(this).parent().find(".is-hidden");
    tooltip.hide();
});​
于 2012-12-07T09:51:08.157 回答
1

尝试在被点击的元素上使用jquery position 方法。

例如var posDown = $(this).position().top

那应该给你正确的位置。

编辑 - 这是一个与 SubRed 非常相似的小提琴，但使用position()和 height 属性来定位工具提示http://jsfiddle.net/FUS27/

于 2012-12-07T09:32:06.830 回答