スムーズに画像が切り替わるロールオーバー：javascript
シェア
ツイートjavascriptでロールオーバー時にスムーズに画像が切り替わるやり方をメモ
≫サンプル
まず、こちらのサイトから
rollover2.jsをダウンロードさせて頂きます。
クロスフェードするロールオーバー処理をお手軽に実装するJavaScript
rollover2.jsの使い方
まず、ダウンロードした「rollover2.js」をhead内で読み込みます。
※UTF-8以外の文字コードのサイトでこのライブラリを利用する際にはcharset=”utf-8″を必ず記述。
<script type="text/javascript" src="js/rollover2.js" charset="utf-8"></script>
あとは、ロールオーバーを適用させたい画像のファイル名を
ロールアウト時：ファイル名_rollout
ロールオーバー時：ファイル名_rollover
にすればＯＫ。
※上記の_rollout等の名前は
rollover2.js内のrollout、_rolloverという箇所を
好きな名前(_off、_on等)に指定すれば変更可能です。
参考サイト
クロスフェードするロールオーバー処理をお手軽に実装するJavaScript
JavaScriptのおすすめ参考書
ポチップ
ポチップ
