よく欲しくなるJavaScriptライブラリに、ツールチップがあります。
jQueryにもたくさんのTooltipプラグインがありますが、使い方が簡単でデザインが綺麗なものということで、qTipを選んでみました。
http://craigsworks.com/projects/qtip/
とても良くできていますが、現状(1.0.0-rc3)では、jQuery 1.4に対応していないようです。
そのまま使うと、以下のエラーが発生します。
$(this).data("qtip") is null
Line 138
これは、jQueryのdata()メソッドの挙動が変更になったためです。
以下のサンプルコードを実施すると分かりますが、jQuery 1.3では「undefined」が表示され、1.4 では「null」が表示されます。
<!DOCTYPE html> <html> <script type="text/javascript" src="jquery14.js"></script> </head> <body> <h1>test</h1> <script type="text/javascript"> alert($('h1').data('hoge')); </script> </body> </html>
JavaScriptでは、nullのtypeはobjectなので、qTipの判定式が誤作動しています。
これを修正するには、qTipのdevelopment版(jquery.qtip-1.0.0-rc3.js)で133行目にあたる箇所に、次の赤い部分を書き加えます。
// Check if element already has qTip data assigned
if(typeof $(this).data('qtip') == 'object' && $(this).data('qtip'))
{
// Set new current interface id
if(typeof $(this).attr('qtip') === 'undefined')
$(this).data('qtip').current = $(this).data('qtip').interfaces.length;// Push new API interface onto interfaces array
$(this).data('qtip').interfaces.push(obj);
}
これで、jQueryのバージョンを落とさずに便利なライブラリを使えますね。
もちろん、ライセンスは要確認です。