3

qTip1 では、実行時にすべてのツールチップを簡単にスタイルできますが、qTip2 以降では、CSS クラスを渡してツールチップに適用することしかできません。

これですっきりしましたが、実行時にツールチップのスタイル (または少なくとも色) を変更する方法はありますか?

クラスを定義するレンダリングされたビューにブロックを追加して<style>から、そのクラスを使用するとうまくいくと思いますが、純粋なJavaScriptの方法を好むでしょう。

どう思いますか ?

4

1 に答える 1

3

以下を使用して、実行時にクラス(およびこのすべてのスタイル)を簡単に変更できます。

$("#tip").qtip('option', 'style.classes', 'class-you-want');

私のデモを見る(実行時にツールチップのスタイルを変更します)

結果

ここに画像の説明を入力

HTML

<a href="#" id="tip">Tooltip for that</a><br>
<a href="#" id="r">RED</a> - <a href="#" id="b">BLUE</a>​

JavaScript

$(function() {
    $("#tip").qtip({
    content: {
        text: "Test"
        }});
    $("#r").click(function() {
        $("#tip").qtip('option', 'style.classes', 'ui-tooltip-red');
    });
    $("#b").click(function() {
        $("#tip").qtip('option', 'style.classes', 'ui-tooltip-blue');
    });
});​

ドキュメントで詳細を読むことができます

于 2012-05-06T20:23:29.993 に答える