Tooltipster显示的图像作为第二时间悬停工具提示(Tooltipster displays

2019-10-22 04:41发布

当我尝试将鼠标悬停在图片,tooltipster应该显示的图像提示。 但我可以在第二次看到提示图像上空盘旋。 它不工作的第一次。

可能是什么原因 ?

 $(document).ready(function() { $('.body_f').hover(function() { $($(this)).tooltipster({ contentAsHTML: true, content: $('<img src="http://' + $(this).attr('alt') + '.jpg" />'), }); }); }; 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/tooltipster/3.0.5/js/jquery.tooltipster.min.js"></script> <img class="body_f" alt="clear" src="http://i.imgur.com/kl70A7M.jpg" alt="i.imgur.com/wttNDm6" /> 

Answer 1:

能够更换如下面Jquery的代码后上加载第一悬停图像。 但是现在的工具提示位置开始的底层图像上,它隐藏在一定程度上。 在第二起悬停的位置看起来不错。 我已经加入OFFSETX:40取消隐藏在第一悬停底层图像。 但是,40不是一个好的解决办法第二盘旋起提示的变化。 原来的问题就解决了。

$(document).ready(function() {

    $('.body_f').tooltipster({
                      contentAsHTML: true, 
                      position: 'top-left',
                      offsetX: 40,
                      functionBefore: function(origin, content) {
                         var data = '<img src="http://' + $(this).attr('alt') + '.jpg" />';

                         origin.tooltipster('content', $(data));

                         content();                     

                      }

                });
};


文章来源: Tooltipster displays image as tooltip on second time hover