- 操作
- エリアホバー
#area hover 009
ホバー時に背景画像の比率が変わる
- 参考サイトURL
-
- きっかわ法律事務所https://www.kikkawalaw.com/
- 動きの解説
-
背景画像がズームアップしたり、縦横比が変わるように見える動きは、静止画に奥行きとストーリー性を与えます。不動産や旅行サイトなど、写真の魅力を最大限に伝えたいコンテンツで、ユーザーの没入感を深める効果があります。実装はbackground-sizeの変更や、imgタグへのtransform: scale適用で行います。画像が拡大される際、画質が荒れないよう十分な解像度の素材を用意すること、そして拡大しても枠内に収めるためのoverflow: hiddenの設定が必須です。