jQueryロールオーバープラグイン

Sep 8, 2010
Tags: javascript, tips

クリーンなHTMLで、簡単に画像のロールオーバーを実装出来る、「jQueryロールオーバープラグイン」

使用方法

末尾に「_on」を付けた、ロールオーバー用画像を用意します。

「jQuery」と、jQueryロールオーバープラグインのサイトから「jquery.rollover.js」をダウンロードし、スクリプトを読み込みます。

<script type="text/javascript" src="js/jquery-rollover/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-rollover/jquery.rollover.js"></script>
<script type="text/javascript" src="js/jquery-rollover/rollover.js"></script>

下記のJavaScriptを「rollover.js」の名前で保存します。

jQuery(function($) {
    // セレクタを指定
    $('#global-nav a img').rollover();
});

input要素にも使えるようです。

jQueryロールオーバープラグイン

Related Entries