1

MooTools 1.4 を使用する Joomla 用の Kunena フォーラム テンプレートがあります。このテーマにブートストラップ ツールチップ機能を統合し、一部のクラスでツールチップをトリガーする MooTools addClass を追加しました。MooTools のドキュメントを確認したところ、コードは次のようになります。

$$('h3 a, .tk-page-header h1 .tk-latestpost a, .tk-topic-title a, .tk-topic-info a, .tk-preview-avatar a, .tk-social-icons a, .kpost-user-icons a, .kicon-profile, .tk-user-info-body li a, span.kkarma-plus, span.kkarma-minus, .btnImage').addClass(' hasTooltip');

上記のコードはhttp://jsfiddle.net/AgpbL/で見ることができます(一番下までスクロール)

残念ながらうまくいかないので、次のjQueryスクリプトを作成しました

jQuery(document).ready(function(a){
   a("h3 a, .tk-page-header h1 .tk-latestpost a, .tk-topic-title a, .tk-topic-info a, .tk-preview-avatar a, .tk-social-icons a, .kpost-user-icons a, .kicon-profile, .tk-user-info-body li a, span.kkarma-plus, span.kkarma-minus, .btnImage").addClass(" hasTooltip");   
});
(jQuery);

そしてそれ自体は非常にうまく機能します。残念ながら、MooTools と競合するため、MooTools に戻り、(stackoverflow を検索した後) 別のコードを作成しました。

$$('h3 a, .tk-page-header h1 .tk-latestpost a, .tk-topic-title a, .tk-topic-info a, .tk-preview-avatar a, .tk-social-icons a, .kpost-user-icons a, .kicon-profile, .tk-user-info-body li a, span.kkarma-plus, span.kkarma-minus, .btnImage').addEvents({
  'mouseenter': function() { $(this).addClass(' hasTooltip'); },
  'mouseleave': function() { $(this).removeClass(' hasTooltip'); }
}); 

そして再び効果はありません。

myElement.addClass(className);基本的なMooTools とjQuery を比較し.addClass( className )ても、大きな違いは見つかりませんでしたが、明らかに何かが間違っていて、理解できません。

ヘルプや他の場所への指摘は大歓迎です。

4

1 に答える 1

1

jQuery との競合があったかどうかはわかりませんが、代わりにMootools .getElements()$$を使用でき、jQuery のようにラップする必要はありませんthis。これを試して:

document.getElements('h3 a, .tk-page-header h1 .tk-latestpost a, .tk-topic-title a, .tk-topic-info a, .tk-preview-avatar a, .tk-social-icons a, .kpost-user-icons a, .kicon-profile, .tk-user-info-body li a, span.kkarma-plus, span.kkarma-minus, .btnImage').addEvents({
  'mouseenter': function() { this.addClass('hasTooltip');},
  'mouseleave': function() { this.removeClass('hasTooltip');}
});

編集:私が提案したコードがオンラインで機能していることがわかります。問題は、私が今理解したのは、jQueryがそれをツールチップに含めたいので、DOMの準備ができていない限り、クラスは役に立たないということです。これは次の質問につながります: これはあなたが望むものですか? ここに画像の説明を入力

これらすべての要素にツールチップが必要な場合は、jQuery がそれらの要素にツールチップを添付する前にクラスを追加する必要があります。したがって、上記のコードを無視して次を使用します。

document.getElements('h3 a, .tk-page-header h1 .tk-latestpost a, .tk-topic-title a, .tk-topic-info a, .tk-preview-avatar a, .tk-social-icons a, .kpost-user-icons a, .kicon-profile, .tk-user-info-body li a, span.kkarma-plus, span.kkarma-minus, .btnImage').addClass('hasTooltip');

jQuery('.hasTooltip').tooltip({"container": false});これは、インデックス ページの先頭にあると思われるこのコードの前に使用します。

ここでフレームワークの競合があるとは思いません。迷子になる素敵なガジェットを備えた複雑なページです:)

于 2013-08-31T21:34:23.420 に答える