動き

動きは、さまざまな要素間のシームレスなアニメーションを確立するのに役立ちます 条件 要素の。ユーザーは、持続時間とイージング スタイルをカスタマイズして、独特な変化を作り出すことができます。一般的なシナリオは、要素のホバー状態に対して洗練された変更を生成し、ホバー時に徐々に変化することを保証することです。

この講義では、

1. ボタンのホバー条件を設計する
2. マウスオーバー時のアニメーションを調整するためのトランジションを作成する

ボタンのホバー条件を設計する

1. ボタンを選択
2. 含める ボックスシャドウ 望ましい外観を実現するために改良する
3. に移動 ホバー 状態
4. 影の深さと距離を高める
5. 元に戻す なし 状態

マウスオーバー時のアニメーションを調整するためのトランジションを作成する

1. 統合する 遷移 選択して ボックスシャドウ プロパティドロップダウンから
2. 500msの持続時間を追加
3. 現在の緩和を維持する
4. ボタンの上にマウスを移動すると、影の強さと距離がスムーズに変化します。

動きやその他の影響に関するさらなる洞察を明らかにします。