jquery - Tooltipster 插件 - 将工具提示放置在中心

标签 jquery center tooltipster

我正在使用 Tooltipster 插件( http://calebjacob.com/tooltipster/#demos )在悬停时显示我的工具提示。 但是,工具提示仅显示在我悬停的元素的顶部/底部。

这是我在元素上悬停时显示工具提示的代码,效果很好

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

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

在 Tooltipster 文档中,“位置”选项不支持“居中”定位。

ToolTipster 位置文档:

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

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

最佳答案

当工具提示准备好显示时,您可以通过覆盖 css 元素定位属性 left 和 top 来实现居中定位。

这里处理函数准备就绪:只需用悬停元素的位置覆盖工具提示的位置

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

关于jquery - Tooltipster 插件 - 将工具提示放置在中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19767433/

相关文章:

javascript - 通过 Javascript 不断查询服务器 - 好主意?

javascript - 单击水平滚动图库中的图像以居中功能不起作用

jquery - 单击按钮时禁用 Tooltipster 工具提示?

jquery - 尝试向独立 SVG 文件添加工具提示功能时,我收到“操作数样式 “invalid '”错误

javascript - 删除第二个 tr 元素上的第一个链接

javascript - 创建一个类似于beforeUnload的JavaScript函数,该函数在单击链接以显示自定义确认对话框时触发

javascript - 如何用jQuery隐藏一个div?

java - 我怎样才能设置在中间呢?

html - 将文本置于 float 元素之间

javascript - 工具提示窗口不适合所有内容