Jquery mouseover和mouseout并在当前位置显示div

Question

我基本上想在鼠标悬停时在鼠标的当前位置显示div。我在堆栈交换中搜索了大部分答案并提出了解决方案。

// JavaScript Document
$(document).ready(function(e) {
    function onmouseover (value, e)
    {
            var mouseX = e.pageX;
            var mouseY = e.pageY;
            $('.box').hide();
            $('.box').css({'top':mouseY,'left':mouseX});
            $('.box').toggle();

    }
    function onmouseout (value) {
        $('.box').hide();

    }
    //Get the message ID
    $(document).on ({
        click: function (e) {
            if (e.target.nodeName == "A")
            {
                e.stopPropagation();
                //e.preventDefault();
            }
            else
            {
                console.log($(this).children('#msgid').text());
            }
        },
        mouseover: function (e) {
            if (e.target.nodeName == "A")
            {

                var value = ($(e.target).attr('href'));
                onmouseover(value, e);
            }
        },
        mouseout: function (e) {
            if (e.target.nodeName == "A")
            {
                var value = ($(e.target).attr('href'));
                onmouseout (value, e);  
            }
        }
    }, ".comment-item");

我可以在鼠标悬停时看到div，但它不在鼠标的位置。

<div class="box"><iframe src="#" width = "50px" height = "50px"></iframe></div>

这是我找到的所有解决方案，但它不适用于我。

我错过了什么？