javascript - 入力タイプのボタンは押している間色が変わる？

Question

input type=button は、押されている間だけ色を変えたいです。たとえば、白いボタンがある場合、押している間だけ緑になり、押されなくなったら白に戻りたいと思います。HTMLとJavascriptでこれを行うにはどうすればよいですか?

Answer 1

この状態の CSS セレクターが呼び出されます:active

したがって、次のようにします。

input.btn:active { background:green }

それはうまくいくはずです。

デモを見る

Answer 2

プレーンバニラHTML+JavaSctipt：

<input type="button" style="background-color:white" value="Click Me" onmousedown="this.style.background='green'" onmouseup="this.style.background='white'" />

デモ： http： //jsfiddle.net/bqjzq/

Answer 3

私にとっては、次の場合にのみ機能します。

<style>
input:active{  background-color:green}
</style>

別のオプションは、ボタンのみに対して、マウスオーバーで指定することです。

<style>
input[type=button]:hover{  background-color: #46000D}
<style>