アニメーションで色が少しずつ変化するボタンを作成する三つのチュートリアル

Post on:2009年12月10日

sponsors

マウスをフォーカスすると、アニメーションで色が少しずつ変化するボタンを作成するPhotoshopとHTML/CSSとJavaScriptの三つのチュートリアルをSix Revisionsから紹介します。

チュートリアルは三部構成で、Photoshop編、HTML/CSS編、JavaScript編となっており、デモページではアニメーション有り版（JavaScript）、無し版（HTML/CSS）があります。

ボタンはCSSスプライトで実装されており、画像の作成もそれ用になっています。

Photoshopでの完成画面

HTML/CSSはシンプルなものとなっており、JavaScriptはjQueryを使用して透過のアニメーションを実装しています。