javascript - jqueryは左上の値を変更するのに十分な速さではありません

Question

ここには非常に単純なロジックがあります。コンテナーを作成し、この場合は css フォント ズームの効果が必要な場所の上に置きます。

しかし問題は、マウスを .sortable li の周りで十分速く動かすと、言葉が飛び交うことです!

デモンストレーション: http://mac.idev.ge:800/words/単語にカーソルを合わせます。

奇妙ですね。この問題を解決するためにコードを最適化するにはどうすればよいですか?

// Zoom on hover effect for sortable items
// Create empty container
$("body").append("<div id='words_zoom'></div>");
var wz = $("#words_zoom");

$(document).on({
    mouseenter: function() {
        var item = $(this);
        var item_offset = item.offset();

        // position the zoom container
        var central_left = item_offset.left;
        var central_top = item_offset.top;

        wz.show();

        wz.css({"left":central_left,"top":central_top});

        wz.html(item.html());

        //
        //wz.stop().animate({"font-size":"2.2em",top:"-=3",left:"-=3"}, 300, "easeOutExpo");
    },
    mouseleave: function() {
        //
    }
}, ".sortable li:not('.delete-text')");

//
$(document).on("mouseleave", "#words_zoom", function() {
    //wz.css({"font-size":"2em",top:"+=3",left:"+=3"}).hide();
    wz.hide();
    wz.css({"left":0,"top":0});
});