javascript - 无法在所需的鼠标位置显示 div

Question

我试图在鼠标指针处显示 mouseenter 事件上的 div。但相反，它在一段距离处显示 div。

$(document).on('mouseenter', '.mediumListIconTextItem', function (e) {
    // $("#school").append($("#show1"));
    // $("#show1").css({'display' : 'block'});
    alert(e.pageX);
    alert(e.pageY);

    $('#show1').css({
        "top": (e.pageY),
        "left": (e.pageX),
        "background-color": "red",
        "z-index": "10",
        "position": "absolute"
    });

    $('#show1').show(); 
});
$(document).on('mouseleave', '.mediumListIconTextItem', function () {
    // $("#show1").css('display','none');
    $('#show1').hide();
});

是否有任何其他解决方案可以在鼠标输入事件和给定指针位置显示 div