FlashとjQueryでツールチップを作るjavascript「Flash Tooltips Using jQuery」

特定の言葉やリンクを吹き出しを表示して説明するツールチップと呼ばれるものがあります。
Flash Tooltips Using jQueryでは、FlashとjQueryを組み合わせています。

使用方法

Flash Tooltips Using jQueryからファイル群をダウンロードします。

<script type="text/javascript" src="http://yourdomain/jquery.js"></script>
<script type="text/javascript" src="http://yourdomain/flash.js"></script>
<script type="text/javascript" src="http://yourdomain/tooltip.config"></script>
<script type="text/javascript" src="http://yourdomain/tooltip.js"></script>
<style type="text/css">
dl.tooltip { display: inline; display: inline; color: #006699; }
dl.tooltip dt { display: inline;  }
dl.tooltip dd { display:none; max-width: 350px; }
dl.tooltip, dl.tooltip dt, dl.tooltip dd { margin: 0; padding: 0; }
.flash-tooltip div { display: none; }
</style>

上記を記述し、ツールチップ部分を以下のように表記します。

<dl class="tooltip">
	<dt>ツールチップ元</dt>
	<dd>内容</dd>
</dl>

サンプル

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic , remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Javascriptサンプルページ一覧

skuare.net