なんか入力場所とか画像とか押せますよー的な場所を示す枠線をマウスオーバーされた時に点滅・明滅をさせたい場合のサンプルコード。
javascriptのonmouse=this.～みたいなかんじでもできるけど、CSSだと簡単すぎるほど簡単。こっちのがお勧めだろう。
その他、画像等に適用するテクニックとしては
- opacityとか使って薄消しにしたりとか
- hover時にテキスト乗せたりとか
- position:relativeで画像をピクつかせたりとか
- 画像を拡大させたりとか
色々あるけど省略。俺には必要ないから。
<html>
<head>
<style type="text/css">
<!--
.waku_onmouse{
background-color:#eee;
border: 1px #000000 solid;
}
.waku_onmouse:hover{
border: 1px #ff0000 solid;
}
-->
</style>
</head>
<body>
<span class='waku_onmouse'> test </span>
</body>
</html>
実行結果：
test