jquery - Tooltipster 在第二次悬停时延迟 3 秒后显示

Question

我想tooltipster tooltip在第二次悬停一段时间后显示

不知何故，我设法tooltip在第二次悬停时禁用。但我想在第二次悬停时显示工具提示，但经过一些延迟。

找小提琴演示

这是代码：

$('.tooltip').each(function(){
    var pos = $(this).attr('data-position');
    //var hvr = $(this).hover();

    $(this).tooltipster({
        contentAsHTML: true,
        maxWidth: 200,
        position: 'right', 
        speed: 150,
        arrow:false,
        multiple: true,
        positionTracker:true,
        onlyOne: true,
        trigger:'hover',
        offsetX:-25,
        offsetY:-80,
        //theme: '.onlyforcategory',
    });

});

$('.tooltip').mouseleave(function(){
    $(this).tooltipster('disable');
});

$('.tooltip').hover(function(){
    //setTimeout(function(){ $(this).tooltipster('enable');}, 2000);
});

Answer 1

在尚未工具提示的工具提示类元素上的鼠标悬停事件上应用工具提示程序并打开它。工具提示将立即打开。

在 tooltipster 设置中定义trigger: 'hover'和delay: 3000。tooltipster 将在此之后（从第二次悬停）在悬停事件上以 3 秒的延迟打开工具提示。

  var tooltipInstance;
        $("body").on('mouseover', '.tooltip:not(.tooltipstered)', function(){
            var pos = $(this).attr('data-position');
            //var hvr = $(this).hover();
            tooltipInstance = $(this).tooltipster({
                trigger: 'hover',
                delay: 3000,
                contentAsHTML: true,
                maxWidth: 200,
                position: 'right',
                speed: 150,
                arrow:false,
                multiple: true,
                positionTracker:true,
                onlyOne: true,
                trigger:'hover',
                offsetX:-25,
                offsetY:-80,
                //theme: '.onlyforcategory',
            });
            tooltipInstance.tooltipster('open');
         });