如何增加工具提示位置的垂直偏移？

Question

我在24px高的图形（锚链接内）上使用了剑道工具提示。因此，当工具提示显示（底部的默认位置）时，它覆盖了图形的底部三分之一，因此无法单击图形的底部三分之一。

我可以做以下事情：

.k-tooltip {
    margin-top: 8px;
}

但问题是，如果工具提示位于页面底部的图形上，则位置将是“顶部”而不是“底部”，但它现在将覆盖图形的大约1/2只有三分之一，因为它仍然被8px压低了。

我想要的是如果位置是底部，那么margin-top是8px，但如果位置是top，则margin-bottom是8px。

感谢您提供的任何帮助！

Billy McCafferty

Answer 1

这个会帮助你吗？ http://dojo.telerik.com/amoZE/5

var tooltip = $("#demo").kendoTooltip({
  filter: "a",
  show: function (e) {
    var position = e.sender.options.position;
    if (position == "bottom") {
      e.sender.popup.element.css("margin-top", "10px");
    } else if(position == "top") {
      e.sender.popup.element.css("margin-bottom", "10px");
    }
  }
}).data("kendoTooltip");

Answer 2

谢谢你的回答，jarno-lahtinen。这非常有帮助！ 提出了两个问题，我想在此处记录解决方案：

1。 Typescript中的属性错误

我正在使用TS，它给了我以下错误： ＆＃34;属性弹出窗口不存在类型工具提示＆＃34;为e.sender.popup。我不确定这是由于更新版本的Kendo还是缺少类型定义。

解决方案：

您可以改为使用this.popup。

2。不适合职位：＆＃34; top＆＃34;

不幸的是，＆＃34; margin-bottom＆＃34;绝对没有效果，因为弹出窗口位于绝对位置＆＃34;使用顶部/左侧。

解决方案：

this.popup.element.css("margin-top", "-10px"); 

这会将弹出窗口向上移动10个像素