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

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

使用方法
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>
吹き出し風のツールチップを作るjavascript「Bubble Tooltips」サンプル

sponsors

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

記事作成:
記事URL:

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