【STUDIO Tips】画像をhoverで切り替える方法

STUDIOではhoverの状態をデザインすることが可能ですが、hoverで画像を入れ替えるような挙動を再現できるの知ってましたか？

実装方法

1. hoverで表示したい画像を配置する

2. その上に通常時に表示したい画像を重ねて配置。重ねて配置した画像のwidthとheightは100%にしましょう。（重ねて配置する場合は、まずは親画像のサイズを大きくして、入れやすくしましょう）

3. 2の手順で設置した通常時の画像を選択し、hover状態をクリック。そして透明度を0にする。

これだけで完成です！🎉

ライブプレビューで確認してみると、画像にカーソルを合わせると画像が切り替わったかのような挙動になります！

ぜひお試しを！