jQuery・Ajaxについて教えて下さい。
jQueryを使用した「Tipped」というツールチップ作成フレームワークを使用しています。
「ツールチップの上にさらにツールチップを表示する」ということが出来ず困っております。
ドキュメント
http://projects.nickstakenburg.com/tipped/documentation
特定のクラス名の文字にカーソルを当てると、Ajaxにより外部HTML(PHP)の内容が小窓で表示されるというものです。
これを使って外部HTMLの表示をすることはできたのですが、
ツールチップ内に表示されるHTMLの中にさらに同名のクラス名を埋め込み、
そこにカーソルを当てたとき二重(入れ子)でツールチップを表示するということをしたいのですが、
最初の1つしか表示されません。
■読み込む側(A.php)
~
必要なファイルの読み込み
~
<span class='tipped' data-tipped='B.php'>カーソルを当てると「B.php」の内容を表示</span>
<script type="text/javascript">
jQuery(document).ready(function() {
Tipped.create(".tipped", { ajax: true });
});
</script>
~
■読み込まれる側(B.php)
<span class='tipped' data-tipped='C.php'>ここにカーソルを当てて「C.php」の内容を表示させたい</span>
A.phpからB.phpのツールチップを表示することはできました。
B.phpからC.phpのツールチップを表示することもできますが、
A.phpに表示したB.phpからはC.phpのツールチップが表示できません。
Ajaxを使わず、B.phpに静的なツールチップを埋め込んだ場合も表示できませんでした。
wordpressの記事ページで動作させています。
必要なjsファイルは読み込んでおり、ファイルはそれぞれ同じ階層にあります。
何が問題で表示できないのでしょうか。どうかご教示をお願いします。