究極のロールオーバーJavaScriptか?

最終更新日: 2008年1月29日 2:57

下準備

  1. http://css-happylife.com/log/javascript/000157.shtml(080129現在)からスクリプト「SmartRollOver.js」をダウンロード
  2. 以下のようにHTMLのhead内に記述し、スクリプトを読み込みます(パスにはご注意ください)
    <script type="text/JavaScript" src="smartRollover.js"></script>
  3. これでOKです。なんという少ない工程!

使用例

使用例と言ってもとっても簡単。「画像名_off」と「画像名_on」という2つの画像を用意しておき、それらを同じパスに保存。「_off」の方をHTMLに読み込むだけです。そう、たとえば以下のように。

画像

ギミック

<p><a href="#"><img src="img_off.gif" alt="画像" width="345" height="106" border="0" /></a></p>

注意点

  1. OFF画像とON画像の縦横サイズは「同じ」である必要があります。