jquery – Tooltipster插件 – 在中心位置工具提示

2023年1月21日 246次阅读

我正在使用Tooltipster插件(
http://calebjacob.com/tooltipster/#demos)在悬停时显示我的工具提示.

但是,工具提示仅显示在我悬停的元素的顶部/底部.

这是我在悬停在元素上时显示工具提示的代码,它运行良好

$(".tooltip").tooltipster({
  animation: "fade",
  delay: 200,
  theme: ".tooltipster-default",
  touchDevices: true,
  trigger: "hover",
  interactive: true,
  position: "top"
});

但是我想要的是在悬停元素的中心显示工具提示.

在Tooltipster文档中,“position”选项不支持“center”定位.

ToolTipster职位文档：

 right, left, top, top-right, top-left, bottom, bottom-right, bottom-left

有人知道如何将工具提示放在元素的中心吗？

最佳答案 当工具提示准备好显示时,您可以通过覆盖左侧和顶部的css元素定位属性来实现中心定位.

这里处理程序functionReady：只是覆盖了工具提示的位置和悬停元素的位置

elem.tooltipster({
    arrow: false,
    functionReady: function(){
          var offset = $(this).offset();
          $(".tooltipster-base").offset(offset);
    },
    theme: 'tooltipster-shadow'
});
点赞