2

こんにちは、ツールチップに関するすべてを読みました。それは JS です。

  1. ブートストラップには、bootstrap-tooltip.js のダウンロードが含まれていなかったため、bootstrap.js ファイルをリンクしただけです。

私のJavaScript:

    <script type="text/javascript">
$('.link').tooltip()
</script>

私のHTML

<a href="#" class="link" data-original-title="first tooltip">Hover me for a tooltip</a>!

js をフッター、div の下、head、top に移動しようとしましたが、うまくいきません。javascript も起動しません。デフォルトのツールチップも表示されません。

マイページ: http://justxp.plutohost.net/jonydesigns/tos.php

私の tos.php ページ全体: http://pastebin.com/qSe9NES7

ツールチップが表示されない理由を誰か教えてください。ブートストラップ css も含めました。ウェブサイト全体が実際にそれで構築されています。

ありがとう!

4

2 に答える 2

4

1:必要なものをbootstrap-tooltip.jsどこにもリンクしていません。(少なくとも、あなたのコードでは見つかりません。)

2:JavaScriptコードは次のように囲む必要があります$(document).ready( ... )

$(document).ready(function() {
    $('.link').tooltip();
});
于 2012-10-22T20:44:09.927 に答える
3

この問題の修正は、ドキュメントで定義されています。

パフォーマンス上の理由から、ツールチップとポップオーバーのデータAPIはオプトインされています。つまり、自分で初期化する必要があります。

ただし、この説明は非常にあいまいであり、例を含める必要があります。ツールチップは「初期化」する必要があります。この場合、ドキュメントレディでこれを行うことができます。

jQuery

$('.link').tooltip();

次に、指定したマークアップにより、マウスオーバーでツールチップが表示されます。

<a href="#" class="link" data-original-title="first tooltip">Hover me for a tooltip</a>!

また、bootstrap.jsにはbootstrap-tooltip.jsが含まれていることに注意してください。この開いているbootstrap.jsを確認し、以下を探します。

/* ===========================================================
 * bootstrap-tooltip.js v2.3.1
 * http://twitter.github.com/bootstrap/javascript.html#tooltips
 * Inspired by the original jQuery.tipsy by Jason Frame

関連する注記として、ポップオーバーには「初期化」も必要です。例えば

マークアップ

<a id="somePopoverId" href="#" rel="popover" class="btn btn-large btn-danger" data-content="Hello world!" title="" data-toggle="popover" data-original-title="A whatever" data-container="body">Popover</a>

jQuery

$("a[rel='popover']").popover({
                placement: "top",
                trigger: "hover"
            });

またはもっと簡単に...

 $("#somePopoverId").popover({
                placement: "top",
                trigger: "hover"
            });
于 2013-03-20T15:13:45.290 に答える