4

このJSFIDDLEで私のコードを確認してください

ツールチップを要素の上に表示したい。私は何が間違っているのですか？

また、ツールチップのjquery UIドキュメントで、位置プロパティに関する有用な情報が見つかりませんでした。何を意味しますか...デモからコードをコピーしました

4

3 に答える 3

9

位置 'my' を 'bottom-(底の距離) に設定する必要があります このJS FIDDLEを確認してください

于 2012-10-16T14:54:34.297 に答える
5

私の理解が正しければ、ツールチップのテキストがツールチップの画像を完全に覆うようにしたいですか?

残念ながら、それはツールチップでは不可能です。その理由は、ツールチップが開始される要素にマウスが「上」にある間のみ、ツールチップが有効になるためです。ツールチップがその要素を覆った瞬間、マウスは選択された要素ではなくツールチップの上にあり、ツールチップの閉じるイベントをトリガーします。

最終結果が方法よりも重要な場合は、ツールチップのopenとcloseイベントの両方clickをデフォルトではなく に設定し、それに応じて配置できます。

編集（説明atとmy：

my要素をat整列させるのに役立つ動的な x、y 座標系のようなものですが、それぞれがそれ自体が x、y であることを除きます。どちらも、相互に関連する 2 つのオブジェクト内に参照ポイントを設定できます。この場合は、ツールチップ ( my) と、ツールチップがインスタンス化されるオブジェクト ( at) です。

myあなたの場合、ポップアップするツールチップでありat、mouseinイベントがトリガーされたときにツールチップがインスタンス化されるイメージです。これらの各オプションは、フラット文字列または相対文字列位置を取り、(DOM の位置で) 2 つのオブジェクトの関係を相互に決定します。したがって、DOM のどこに表示されるかに関係なく、ツールチップの上部中央を画像の絶対中央に揃えたい場合は、次のように設定します。

position: {
            my: "center top",
            at: "center center"
        }

myいずれかまたは両方をオフセットatし、ピクセル値または % 値を組み合わせることによって、 さらに制御を得ることができます。

position: {
            my: "center+10 top+50",
            at: "center+5 center+25"
        }
于 2012-10-16T14:54:05.470 に答える
2

この用語について理解できなかった将来の検索者に簡単な答えを与えたい..定義は..私は私のセレクタ..「私の」画像のように..

$('img').tooltip();

一方、ツールチップが表示される場所は「at」です

例えば：

$('img').tooltip({ position: { my: "right center", at: "left center" } });

ここでは、'my' 画像を垂直方向に中央揃えで右側に配置することを選択しました。ツールチップは、画像に対して左側に表示され、垂直方向にも中央揃えで表示されます。

于 2013-01-20T15:04:57.807 に答える