Как увеличить вертикальное смещение положения всплывающей подсказки?

Question

Я использую подсказки кендо на графике (в пределах ссылки), высота которого составляет 24 пикселя. Соответственно, когда всплывающая подсказка отображается (позиция по умолчанию внизу), она закрывает нижнюю треть графического объекта, и поэтому нижняя треть графического объекта не может быть нажата.

Я могу сделать следующее:

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

Но проблема в том, что если всплывающая подсказка находится на графике в нижней части страницы, позиция будет "верхней", а не "нижней", но теперь она будет покрывать около 1/2 графика вместо просто третий, потому что он все еще отталкивается на 8 пикселей.

Что бы я хотел, если бы позиция была нижней, то поле margin-top было бы 8px, но если позиция top, то поле margin-bottom было бы 8px.

Спасибо за любую помощь, вы можете предоставить!

Билли Маккаферти

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

Спасибо за ваш ответ, Ярно-Лахтинен. Это было очень полезно! Возникли две проблемы, и я хотел бы документировать решения здесь:

1. Ошибка свойства в машинописи

Я использую TS, и он дал мне следующую ошибку: "Всплывающее окно свойств не существует в подсказке типа" для e.sender.popup, Я не уверен, связано ли это с более новой версией Kendo или отсутствующими определениями типов.

Решение:

ты можешь использовать this.popup вместо.

2. Не работает на должность: "верх"

К сожалению, "margin-bottom" не имеет абсолютно никакого эффекта, потому что всплывающее окно позиционируется как "абсолютно" с использованием top/left.

Решение:

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

Это сместит всплывающее окно вверх на 10 пикселей.