[JS]背景やテキストの色を少しずつ変更するスクリプト -fader.js

leigeberのエントリーから、背景やテキストやボーダーの色を、指定色から指定色に少しずつ変更するスクリプトの紹介です。

JavaScript Color Fading Script
デモページ

デモには、下記の4つがあります。

• ホバーすると、背景の色をフェード。
• クリックすると、背景の色をフェード。
• ホバーすると、テキストの色をフェード。
• ホバーすると、ボーダーの色をフェード。

fader.jsの動作環境は、IE6/IE7, Firefox, Opera and Safariとなっており、jQueryやPrototypeなどの他のスクリプトに依存せずに動作する軽量(約2KB）のスクリプトです。

実装も簡単で、「fader.js」を外部スクリプトとして配置し、下記のように指定します。

1番目

id名

2番目

「background」「text」「border」を指定

3番目

最初の色

4番目

最後の色

5番目(オプション)

色の分割数

6番目(オプション)

色の移行スピード