Javascript 加载工具提示时旋转鼠标光标旁边的图标（jQuery）

我有一个独特的情况，我想在鼠标光标旁边显示一个旋转加载图标

当用户将鼠标悬停在

div

上时，将显示此图标。延迟

1300ms后将显示工具提示。旋转图标将在工具提示延迟时显示，然后在工具提示显示后隐藏

我已经使用编写了一些代码，并且实现了我所需要的。但是，一旦显示工具提示且旋转图标消失，当我移动鼠标光标时，它会立即返回。我希望图标永久消失，直到鼠标移到div之外


例如：
我创造了一个新的世界

将鼠标光标悬停在
产品信息容器上
。您将看到旋转图标出现，1300ms后，工具提示将显示，旋转图标将消失。但一旦你再次移动鼠标，图标就会回来


显示工具提示后，无论是否移动鼠标，如何永久隐藏旋转图标

到目前为止，我得到的jQuery代码如下

jQuery( document ).ready( function( $ ) {
    var delay = 1300;
    var timeout;
    $('.product-bottom-info-container').hover(
        function(e) {
            var that = $(this);
            timeout = setTimeout(function() {
                that.find('.product-custom-tooltip-container').css({
                    display: 'inline-block',
                    position: 'fixed',
                    zIndex: '5000',
                    margin: '10px',
                    whiteSpace: "nowrap"
                }).position({
                    my: "right+10 center",
                    at: "center",
                    of: e,
                    collision: "fit flip"
                });

                $('.mouse-spinner').hide();
            }, delay);
        }, 
        function() {
            clearTimeout(timeout);
            $(this).find('.product-custom-tooltip-container').hide();
            $('.mouse-spinner').hide();
        }
    ).mousemove(function(e) {
        $('.mouse-spinner').css({
            display: 'inline-block',
            position: 'fixed',
            zIndex: '5000',
        }).position({
            my: "left+10 top+12",
            at: "center",
            of: e,
            collision: "flip"
        });
    });
});

谢谢。
您可以通过样式表的类设置微调器css静态部分，并在工具提示激活时重新定义它。或者，您可以将“timeout”作为mousemove函数内代码的条件进行检查，或者您也可以将附加类设置为mousemove函数执行的条件。有很多解决方案可以解决您的问题。
谢谢您的建议。我会根据你的信息玩它。你能给我看一个这些解决方案的例子吗？好的，我只需要添加$（'.mouse spinner'）.hide（）；返回悬停函数，因为它已在代码中删除。否则，这是可行的。谢谢你，伙计。