0

この星評価プラグインを使用しました。各星のアイコンにカーソルを合わせると、デフォルトのツールチップが表示されます。デフォルトのツールチップの代わりにこのツールチップを使用したい。必要なファイルをすべて配置し、次のように HTML を作成しました。

<input class="hover-star tooltip" type="radio" name="rating-1" value="3" title="OK"/>

しかし、その評価プラグインではツールチップが機能しないようです。私はjavascriptが苦手です。そのため、ツールチップを機能させるためにどこを変更すればよいかわかりません。どうすればいいですか？これが私のフィドル作品です

4

1 に答える 1

1

評価プラグインはマークアップを変更します (タイトルを含む <a> タグを追加します)。したがって、次のようにセレクターを調整してください。

$('.tooltip a').tooltipster({
    interactive: true,
    contentAsHTML: true,
});

動作デモを参照してください。

編集: <a> タグのタイトルは Tooltipster によって削除されるため、少し異なるセレクターを使用してツールチップ テキストを取得できます。

...
focus: function(value, link){
  var tip = $('.hover-test');
  tip[0].data = tip[0].data || tip.html();
  tip.html($(link).parent().attr('aria-label') || 'value: '+value);
},
...

これはあまりきれいではありませんが、仕事をするはずです。更新されたデモを参照してください。

于 2014-08-22T14:10:36.717 に答える