吹き出し風のツールチップを作るjavascript「Bubble Tooltips」

aなどのタグにtitle属性を付与すると、説明が表示されます。
しかし、そのままでは味気ないのでツールチップと呼ばれるjavascriptが多く公開されています。
Bubble Tooltipsもツールチップの一つですが、マンガの吹き出しの様な形で表示されます。

sponsors

使用方法

Bubble TooltipsからBubbleTooltips.js、bt.gif.css、bt.gifをダウンロードします。
<script src="http://yourdomain/BubbleTooltips.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload=function(){enableTooltips()};
</script>

上記のように記述すれば準備完了です。
後はhtmlでリンクを普段通り書き込めば吹き出しが表示されるようになります。
<a href="リンク先" title="タイトル">テキスト</a>

sponsors

サンプル

ノーマルリンク:skuare.net
タイトル付きリンク:skuare.net
Javascriptサンプルページ一覧
skuare.net