追記:2012/02/17

jquery.balloon.jsはバージョンアップされているようですのでそちらをお使いください。

追記ココマデ

ツールチップを表示するこちらのJQueryプラグイン「jquery.balloon.js」について動的に消したいのになかなか消せなかったのでメモ。

経緯:

削除ボタンがあって、そのボタンにマウスをあわせると「削除する」とツールチップを表示するために上記のプラグインを用いていたのですが、クリック時にボタン自体を消したら、ツールチップだけ画面に残ってしまった。

解決:

Balloonにはballoonを設定したオブジェクトに対し、data(“balloon”)で取得できる模様。

deleteBtn.click(function(){
$(this).data("balloon").remove();
});
deleteBtn.balloon();

 

追記2011/11/11

 

上記の方法では不十分。消した後、ブラウザの画面サイズを変更するjavascriptエラーがでる。
理由はツールチップを表示したときに$.balloon.instancesに配列を追加していて、window.resizeイベントでそれらの配列の要素にアクセスしているため。

本当は拡張したかったのだが、面倒だったので直接プラグインに変更を加えた。

1:$.balloonにメソッドを二つ追加。

2:配列に常に突っ込むのをやめて、重複していないかのチェックをするように変更。

 

追記2 2011/11/11

と思ったが、adjustBalloonで位置が設定できない現象が。理由はこのメソッドが呼ばれたときに要素が表示されていないこと。表示する瞬間に位置情報を計算したほうがよいのではないかと思い、再び改造。

showメソッドの中で計算した。それによって$.balloon.instances関連のものが必要なくなった。

誰の助けになるかわかりませんが一応ソースを張っておきます。