イメージボタンのホバー効果を実現する方法は？

Question

ホバー効果のある画像ボタンを取得するにはどうすればよいですか？私は2つのボタン画像を持っています。一つはシンプルですが、もう一つはホバーの画像ですか？

Answer 1

あなたはCSSで簡単に行うことができます。

input[type='button']:hover 
{ 
    color: #00a; 
    //or background-image: url("url"); 
} 

Answer 2

スプライト画像を使用し、背景画像を移動したかどうかに応じて移動することで、CSSで簡単に行うことができます。

CSS：

a { display:block; width: 80px; height: 40px; background: url(bgImage.png) top; 
a:hover { background: url(bgImage.png) bottom; } 

あなたはこれを機能させるための単一のイメージにあなたの「シンプル」と「ホバー」の画像を結合する必要があります。