Tooltipster在第二次悬停时将图像显示为工具提示

时间:2015-03-06 11:19:51

标签: jquery tooltipster

当我尝试将鼠标悬停在图像上时,工具提示器应显示图像工具提示。但我可以看到第二次悬停的工具提示图像。它不是第一次工作。

可能是什么原因?



$(document).ready(function() {

      $('.body_f').hover(function() {

          $($(this)).tooltipster({

            contentAsHTML: true,

            content: $('<img src="http://' + $(this).attr('alt') + '.jpg" />'),

          });

      });
};
&#13;
<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" />
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

在更换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();                     

                      }

                });
};