画像のロールオーバーを実装する方法は数多く存在しますが、ロールオーバーしてるのかしてないのかよく分からないモノが多いですよね。多いです。

そんな悩みはサクッと解決しちゃいたい！そんなアナタのために、ものすごい勢いでロールオーバーするjQueryプラグインを作りました。

input要素にも使えるjQueryのロールオーバープラグインとの互換性もバッチリなので、プラグインのファイルを差し替えるだけで動作します。

ダウンロードとデモ

jdtrollover.js

デモを見る

導入方法

1. jQueryとjDTRolloverを読み込む

<script src="jquery.js"></script>
<script src="jdtrollover.js"></script>

2. 実行する

$() で対象にする要素を指定します。アンカーの中にある画像を指定するのが一般的ですね。

jQuery(function($) {
  $('a img').jdtRollover();

  // 以下の指定方法にも対応！最高の互換性！
  $('a img').rollover();
});

オプション

第一引数

ロールオーバー画像に付けるsuffix。デフォルトは_onだ。

第二引数

勢い。1か2くらいにしないと正常に動作しない。

注意

わりと喋ります。