# 創建懸停（鼠標移動）時旋轉的動畫

設置一個基於鼠標位置的旋轉：

1. 設定視角
2. 設定觸發器
3. 製作旋轉的動畫
4. 配置靜止狀態
5. 創建一個鏡面高光

## 設定視角

1. 確保您要做動畫的子元素的父元素被選中
2. 在過渡和變換下的樣式面板中，將子元素的視角改為1000像素

## 設定觸發器

1. 選擇您想作為觸發器的元素（例如卡片）
2. 在互動面板中，點擊選定元素旁邊的加號，從下拉選單中選擇鼠標在元素上移動

## 製作旋轉的動畫

1. 點擊互動面板 > 鼠標移動時 > 動作 > 播放鼠標動畫
2. 點擊鼠標動畫旁邊的加號
3. 命名它（例如在鼠標移動時旋轉）
4. 點擊鼠標X動作時間線下的加號，在0%處選擇旋轉
5. 在旋轉下，將Y軸改為-5度
6. 點擊100%處的卡片元素，在旋轉下將其Y軸改為5度
7. 在鼠標Y動作下，添加一個旋轉的動作
8. 在"旋轉"的0%處，將X軸改為5度
9. 在100%的旋轉下，將X軸改為-5度
10. 關閉動畫以調整平滑度

## 配置靜止狀態

1. 在交互面板中的鼠標移動時，將鼠標的X位置設置為50%。
2. 將鼠標的Y位置設置為50%。

## 創建一個鏡面高光

1. 在畫布上拖動一個新的Div塊到您正在使用的元素裡面（Card）
2. 創建一個class，並命名它（例如卡片-高光）
3. 設定其寬度和高度（例如400像素）
4. 將位置設置為絕對值
5. 從左上角開始定位
6. 設定背景顏色
7. 在邊框下，將半徑改為50%
8. 在"效果"下，將"不透明度"改為10%
9. 添加一個模糊過濾器，將半徑改為50像素
10. 在互動面板上，點擊鼠標移動時的旋轉
11. 在鼠標X時間線的0%處添加一個移動動畫，將其X軸改為100%
12. 在鼠標X時間線的100%處，添加一個移動動畫，並將其X軸改為-50%
13. 在鼠標Y軸的時間線0%處，添加一個移動動畫，並將其Y軸改為50%
14. 在鼠標Y軸的時間線上，在100%處添加一個移動動畫，並將其Y軸改為-50%