5

高さ 24px のグラフィック (アンカー リンク内) で剣道ツールチップを使用しています。したがって、ツールチップが表示されると (下のデフォルト位置)、グラフィックの下 3 分の 1 がカバーされるため、グラフィックの下 3 分の 1 をクリックすることはできません。

私は次のことができます：

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

しかし、これに関する問題は、ツールチップがページの下部にあるグラフィックにある場合、位置は「下部」ではなく「上部」になりますが、グラフィックの半分ではなく約 1/2 をカバーすることです。 3 番目は、まだ 8px 押し下げられているためです。

私が望むのは、位置が下の場合、margin-top は 8px ですが、位置が top の場合、margin-bottom は 8px です。

ご協力いただきありがとうございます。

ビリー・マカファティ

4

2 に答える 2

6

これはあなたを助けますか？ 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");

于 2015-03-27T10:15:42.013 に答える
2

jarno-lahtinen さん、ご回答ありがとうございます。とても助かりました！2 つの問題が発生したので、ここで解決策を文書化したいと思います。

1. Typescript のプロパティエラー

TS を使用していますが、次のエラーが表示されましたe.sender.popup。これが Kendo の新しいバージョンによるものなのか、型定義の欠落によるものなのかはわかりません。

解決：

代わりに使用できますthis.popup。

2.「トップ」の位置で機能しない

残念ながら、ポップアップは上/左を使用して「絶対」に配置されるため、「margin-bottom」はまったく効果がありません。

解決：

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

これにより、ポップアップが10ピクセル上に移動します

于 2016-12-13T22:08:28.367 に答える