14

軽量で画像マップで簡単に使用できるツールチップ用の軽量 jQuery スクリプトを探しています...理想的には、各エリア タグの「タイトル」をツールチップとして自動的に取得します。これが問題である理由は、何百もの領域 (世界地図) があり、各ツールチップのコード行がすぐにファイル サイズに加算されるためです。

qTipはこれを行うことができます...しかし、その38kbは...jQuery自体よりも大きいです。推奨事項はありますか?

4

5 に答える 5

18

それがまさにあなたが探しているものかどうかはわかりませんが、Tipsy をチェックしてください:
http://onehackoranother.com/projects/jquery/tipsy/

9 KB 非圧縮
4 KB 縮小

于 2010-01-07T19:02:43.137 に答える
2

vTipが良い候補かもしれません (デモを参照)。少し時代遅れですが、非常にシンプルで機能するはずです。

class="vtip" を追加して DOM 要素をマークするだけです。

<a href="#" title="Tooltip content" class="vtip">Tooltip test</a>

非圧縮の JS ファイルはわずか 4KB です。

ツールチップをより動的な方法で処理したい場合は、独自の単純なツールチップを作成することを検討してください。

于 2013-04-15T09:22:51.163 に答える
1

想像力豊かなタイトルの「jQuery Tooltip」: demo hereを使用します。イメージ マップとうまく連携し、CSS で簡単にカスタマイズできます。

(偶然にも、イメージ マップで qTip を試してみたところ、 Map Hilightプラグインと組み合わせると奇妙なバグが見つかりました)。

于 2010-01-07T12:34:27.030 に答える
1

大規模な調査の後、この質問に対する回答はどれも満足のいくものではありませんでした。

私は軽量で、ほろ酔いとして放棄されていない1つのソリューションが必要でした(最後の更新は数年前、作成者によって無視された63のバグ修正プルリクエスト)、ホバー時のフォームフィールドのヒントとして典型的なツールチップとして使用できますが、後の動的フィールド検証にも使用できますフォーム送信。

前述の PowerTip は非常に優れていますが、大きな問題があります。一度に表示できるツールチップは 1 つだけです。私にとっては失格です。リソースを確認しましたが、これは作成者の基本的な前提です。一度に 1 つのツールチップのみ、すべてのツールチップに対して 1 つの DOM オブジェクトがあるなどです。

ツールチップスター

さらに1時間を失った後、まさに私が必要としていた解決策を見つけました: Tooltipster。実装は非常に簡単ですが (PowerTip に非常に似ています)、一度に多くのツールヒントを準備して表示することができます。もう 1 つの利点は、画像をまったく使用しないことです。js (~12k) と css のみです。

これにより、誰かが何時間もの研究を節約できることを願っています。

于 2013-05-14T04:31:42.080 に答える