7

jQuery qTipプラグインの通常の動作は、割り当てられたすべてのツールチップ アイテムに対して新しい隠し div を作成することです。DOM が乱雑になるのを避けるために、1 つの非表示のツールチップ要素を複数のターゲットに関連付ける方法はありますか?

不自然な例:

<div id="foo1"></div>
<div id="foo2"></div>

<script> $("#foo1,#foo2").qTip({"content":"test"}); </script>

<!-- Creates two elements, rather than one: -->
<div class="qtip" style="display:none;">test</div>
<div class="qtip" style="display:none;">test</div>

qTip がこれを行うことができない場合、単一のツールチップ コンテナーのみを使用してリッチ HTML をサポートする別の jQuery ベースのツールチップ プラグインを推奨できる人はいますか? ありがとう！

4

4 に答える 4

2

私はjQuery Tools Tooltipのファンです。HTML で独自のツールチップ構造を定義でき、そのツールチップを必要な数の要素に適用できます。

于 2010-01-04T00:54:19.717 に答える
1

コンマ区切りの要素リストを作成する代わりに、クラス セレクターを使用します。次に例を示します。

$('.selectorClass').qTip({arguments:here});

私はこれをテストしていませんが、うまくいくはずです。

于 2010-01-05T17:40:15.513 に答える
1

誰かが便利だと思ったら、1 つのツールチップ div を多くのツールチップ イメージで共有する方法を見つけました。

 $(".tooltipBearing").qtip({
                            content: {  
                                text: $("#tooltipDiv").html()
                            }          
                      });

そこに.html()を配置できなかった場合、共有ツールチップが一度表示され、別のイメージからアクティブ化すると、最初のイメージでは機能しなくなります...

tooltipBearingは、ページ内の一部の画像に設定されたクラスです。

tooltipDivは、ツールチップ コンテンツを含む div の ID です。

于 2013-08-13T19:46:27.380 に答える
1

qTip ボックスを動的に構築できます。

HTML:

<a id="some-link" href="#">Show a qTip</a>
<div id="hidden-element" style="display:none"></div>

Javascript:

$('#some-link').click(function() {
    $('#hidden-element').qtip({
        content: {
            text: '<div>Insert content here</div>',
            prerender: true  //as of beta3, this option is false by default
        },
        // etc, etc
    });

    qtip = jQuery('#hidden-element').qtip('api');
    qtip.show();

    return false;
});

qTip API の詳細については、http: //craigsworks.com/projects/qtip/docs/api を参照してください。

編集: 2011 年 6 月 22 日 (justgrumpy) - beta3の時点で、qtip はデフォルトで prerender しません。qtip を動的に表示するには、content オプションで「prerender」を「true」に設定する必要があります。

于 2010-01-10T12:17:00.640 に答える