}); 何回か試して違いを確認してみてください！, 種類が多くて何を使ったらいいのか・・・という感じですが、初期状態か、ease-in-outを使っておけば大丈夫かなと思います。, 特定のCSS以外の部分で分からないところがあれば、以下の記事をチェックすればわかるかなと思います。. （切り替わりの感じとしては↓下記サイト↓のようなイメージです。）
padding: 0;
}); サムネイルにマウスオーバーしたら画像を切り替える
ホバーを覚えることで、デザインの幅が広がるだけでなく、ユーザにとって分かりやすいデザインにすることが可能です！, そもそもhoverは、マウスのポインタ（アイコン）を要素の上に置いた時に実行されるものです。, リンクやボタンと一緒に使われることがほとんどで、マウスカーソルを合わせたときに何かしらの反応があることで、（ここは押せる部分なんだな）と思わせることができます。, :before,:after,:visited,そして今回紹介する:hoverなど、様々な疑似クラスがあります。, 疑似クラスがどうこう言われてもイメージが湧かないと思いますので、実際にどのような使い方をするのか見ていきましょう！, このように、sample1というクラスに対してhoverを指定することで、ホバー時に背景色を#c8e6c9から#4caf50に変化させることができます。, jQuery(function($){ を改変して同じようなものを作る。でもOKです。）
$(".sample3").css("box-shadow","0 14px 20px -4px rgba(0,0,0,.25)"); $(".sample3").css("box-shadow","none");
ul {
onMouseOut="document.mainImg.src='images/A1.jpg'">
}); 