問題タブ [tooltipster]

NYTimes のオバマ予算表示 ( http://www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html?_r=0 ) とズーム可能D3 の例のページにあるサークル パッキングの例を見て、インターンにデータセットのナビゲーション用の Web ベースのインターフェイスを開発するように指示するように促されました。私たち (ほとんどの場合彼) は、サークル パッキング関数を使用して階層構造を描画し、ズームイン、ズームアウトすることができるので、データは機能しています。追加したいのは、(円の本体をクリックするのではなく) 円のタイトルにホバーまたはクリックして、インタラクティブなツールチップを表示する機能です (私は個人的にここに示されているものに偏っています: http://iamceege.github .io/tooltipster/ )。

非常に大まかな擬似コードでは、次のようなものを探しています。

お察しのとおり、私は JavaScript プログラマーではありません。ここでダートアプローチでうなり声を上げてしまったことをお詫びします。私たちのインターンはある程度のスキルを持っていますが、苦労しています。ここで成功するためのいくつかの便利なヒントに過ぎないように感じます。

どんな助けでも大歓迎です。

乾杯。

JD

私はtooltipsterを使用しており、メニューボタンがクリックされたときに表示されるツールチップがあります (このビットは正常に動作します)。ただし、ツールチップ内の閉じるボタンでツールチップを閉じるのに問題があります。

かなり単純なものが欠けているに違いありません。

HTML

ツールチップの HTML (念のため)

JS

ユーザーがクリックするアイコンを含む ajax リクエストを介して生成されるツールチップ ( https://github.com/iamceege/tooltipster ) があります。ただし、イベントが発生したときにリスナーを機能させることはできません。以下のコードでは、アラート ポップアップが表示されません。ツールチップ内のイベントを取得するにはどうすればよいですか?

ツールチップスターを初期化する方法は次のとおりです。

これは、Site.Funcs.templateCall() によって解析された後にツールチップに更新されるコンテンツです。

最後に、クリック イベントのリスナー:

どんな助けでも大歓迎です。

アコーディオンのように動作する「引き出し」でいっぱいのページがあります。さまざまな理由で Jquery UI アコーディオンを使用できませんでした。代わりに、動的ドライブから Animated Collapse 2.4 を使用しています。各ドロワー div には、固有のフォームが含まれています。これらのフォームでは、Jquery Validator と tooltipster を使用して検証エラーを表示しています。

私が抱えている問題は、検証が成功する前にドローが閉じられたときに、ツールチップスターが完全に消えず、フォームがあった場所にぶら下がっていて、ページをスクロールしたり移動したりすると、ページの左上にジャンプすることです画面半分表示！そのため、彼らは隠れていますが、完全には隠れていません。上下に数十ピクセルだけ配置する必要があるかのようです。

フォームを含む複数の div ドロワーがあるため、ある特定のドローのフォームを完成させて他のデータを参照するときに、別のドロワーに切り替える必要がある場合があります。そのため、ユーザーが各フォームを完全に入力せずに引き出しを閉じて、後で戻ってくることができるようにする必要がある場合があります。

アイデアはありますか？

animationcollapse.js 用の Dynamic Drive の js スクリプトを含める必要があります - Linkで入手可能

また、リンクでダウンロードできる jquery.tooltipster.js および css ファイルを含める必要があります。

HTML:

そしてJS：

jQuery データテーブルで Tooltipster を使用すると問題が発生します。ツールチップは最初のページでのみ機能し、後続のページでは機能しません。

更新：私のjsは

上記のコードは機能しています。これを短くするか、現在よりもきれいにすることができるかどうかを知りたい.

ありがとう。

Tooltipster を使用して、js 2D 配列として設定された英語/タイ語の用語集から選択した単語をツールチップに入力したいと考えています。その意図は、英単語がツールチップ化されると、ペアになったタイ語にアクセスして表示するために使用されることです。これらはすべてモーダル ダイアログにあります。html は次のとおりです。

ここにjsコードがあります（配列はグローバル変数として設定されています）

Firebug は、Tooltipster が初期化されていることを示すクラス「tooltipstered」が html に追加されていることを示しています。私はこの点を超えて少し迷っています。functionAfter がここに行く正しい方法なのか、それとも他のコードなのかはわかりません。どんなアドバイスでも大歓迎です

私に提案されたように、検証プラグインのエラーメッセージにツールチップスターを使用しました。この解決策はうまく機能しますが、ダイアログ ウィンドウを開くときに問題が発生します。エラー メッセージ (ツールチップスター) が表示され、ダイアログ (fancybox v2) を開くと、ダイアログ ウィンドウ上でツールチップスターがアクティブなままになります。この問題を解決するために、fancybox beforeShow イベントでツールチップスターを閉じようとしましたが、この方法でダイアログ ボックスを閉じて再検証しようとすると、ツールチップが開かなくなりました。

HTML

どうすれば修正できますか？ありがとう

ここにデモがあります：

http://jsfiddle.net/2012j6dv/10/

私はtooltipster（http://iamceege.github.io/tooltipster/）でangularjsを使用しています。テキストにカーソルを合わせると画像が表示されるページを作りたい(googleapis.com http request)。ただし、いくつかの問題があります。

• 初めてテキストにカーソルを合わせると、画像の 1/4 しか表示されません。2 回目には、完全なイメージが表示されます。
• 非常に速くホバリングすると、画像が画面に「焼き付き」ます。表示されているように、要素が作成される前に "hide" を呼び出します (つまり、Web サービスがコードに応答を送信します)。

ここで見つけることができる例を提供しました：http://jsbin.com/dubome/1/edit

どんな種類の助けも大歓迎です！

jQuery Tooltipsterng-repeatを次のように要素にアタッチする AngularJS ディレクティブがあります。

意見：

指令：

or - ?mute()で定義された関数を呼び出したい プラグインはディレクティブに HTML コンテンツを追加するため、何をする必要があるのか​​ わかりません。scope$scope