javascript - 通过 Javascript/Jquery 文本的划分跟随光标

Question

我希望随着光标在网络浏览器空间中的动态内容划分。

我不是 JS 专家所以我花了 2 个小时终于调试了一个非常愚蠢的方法来完成这个。

$(document).ready(function () {
    function func(evt) {
        var evt = (evt) ? evt : event;
        var div = document.createElement('div');

        div.style.position = "absolute";

        div.style.left = evt.clientX + "px";

        div.style.top = evt.clientY + "px";
        $(div).attr("id", "current")

        div.innerHTML = "CURSOR FOLLOW TEXT";

        $(this).append($(div));

        $(this).unbind()
        $(this).bind('mousemove', function () {
            $('div').remove("#current");

        });

        $(this).bind('mousemove', func);

    }

    $("body").bind('mousemove', func)
});

如您所见，这几乎是蛮力攻击，它会大大降低浏览器的速度。当我将鼠标从一个地方拖到另一个地方时，我经常会遇到浏览器延迟。

有没有一种方法可以更轻松、更快速、更直观地完成此任务。

我知道您可以使用光标图像技术，但这是我希望避免的事情。

提前致谢。

Answer 1

根据 Alconja 的回答，这可能会更好:

$(document).ready(function () {
    //create the div
    var div = $("<div/>",{
        'css': {
            "position": "fixed"
        },
        'text': "CURSOR FOLLOW TEXT"
    }).appendTo("body");

    //attach the mousemove event
    $(window).bind('mousemove mouseover', function(evt) {
        div.offset({left:evt.pageX, top: evt.pageY});
    });
});