Javascript 鼠标绑定图像后的悬停效果

我有一个用鼠标绑定图像的代码

$(function(){
    var $i = $('#gg');
    $( "#gg" ).click(function() {
        $(document).bind('mousemove',function(e){
            $i.css({
                left: e.pageX -42,
                top:  e.pageY -60
            });
        });
    });
});

绑定后，我想在鼠标上方隐藏另一个图像。 看看这个

请告诉我任何想法

$(function () {
    var $i = $("#gg")
    $i.click(function () {
        $i.css('pointer-events','none');
        $(document).on('mousemove', function (e) {
            $i.css({
                left: e.pageX - 42,
                top: e.pageY - 60
            });
        });
        $('#gg1').one('mouseenter', function() {
            $(this).hide();
        });
    });
});