【问题标题】:Tooltipster show after 3 seconds delay on second hoverTooltipster 在第二次悬停时延迟 3 秒后显示
【发布时间】:2016-02-16 12:38:53
【问题描述】:

我想在第二次悬停后显示tooltipster tooltip

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

find fiddle demo

这是代码:

$('.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);
});

【问题讨论】:

    标签: jquery callback hover tooltip tooltipster


    【解决方案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');
             });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-12-21
      • 2016-03-15
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多