JQuery偏移受滚动条的影响

Question

我为正在开发的管理面板中的某些按钮创建了一个简单的工具提示。当用户盘旋时，我使用一些非常标准的JQuery代码将工具提示放在按钮上方。但是，无论是否存在滚动条，似乎存在一些定位问题。

当滚动条出现时，工具提示会显示在正确的位置......

当滚动条的内容不足时，tooltop似乎与滚动条的宽度相关...

因为我使用offset（）。left - 这似乎很奇怪，这不应该受到页面宽度的影响。这是我正在使用的代码...

var ttl;
var tt;
$('.icon').mouseover(function (e) {
    ttl = $(this).attr('title');
    $(this).attr('title', '');

    $('body').append('' +
        '<div id="tt" class="tt">' +
        '   <div class="tttxt">' +
        '   ' + ttl +
        '   </div>' +
        '   <div class="ttnib">&nbsp;</div>' +
        '</div>');
    tt = $('#tt');

    var y = $(this).offset().top - tt.outerHeight();
    var x = $(this).offset().left - (tt.outerWidth() - $(this).outerWidth()) / 2;
    tt.css('left', x + 'px').css('top', y + 'px');
});
$('.icon').mouseout(function () {
    $(this).attr('title', ttl);
    tt.remove();
});

非常感谢任何帮助。

Answer 1

好的，所以我最终完成了这项工作。我最初将工具提示附加到body标签。当我添加一个包装器div并附加到其上时，工具提示在有或没有滚动条的情况下正确对齐。不知道为什么附加在身体上会引起变化，但至少我让它起作用了。

<强>更新

发布此消息后不久，我找到了真正的罪魁祸首。我在包装器DIV上有100％的高度（还有一些其他元素：HTML，FORM）。删除之后，所有内容都已修复。我知道最好不要像这样高高举起，但我想要效果。哦，好吧。