滑鼠經過動畫選單製作?

滑鼠經過動畫選單製作,這裡提供精美滑鼠經過動畫效果選單,涉及ui的朋友可以看看了。

滑鼠經過動畫選單製作

工具/原料

文字編輯器

計算機

方法/步驟

首先新建資料夾(名稱自定);資料夾下面新建style資料夾(裡面存放圖片,CSS,js檔案素材);

滑鼠經過動畫選單製作

開啟文字編輯器,新建index.htm檔案,如圖所示。儲存到(自定)檔案加下面。

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

開啟style資料夾新建檔案lavalamp_test.css檔案;如圖所示,儲存到style資料夾下面。

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

開啟style資料夾,新建檔案jquery.lavalamp.js檔案,如圖所示,儲存到style目錄下。

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

開啟style資料夾,新建檔案jquery.lavalamp.min.js檔案,如圖所示,儲存到style目錄下。

滑鼠經過動畫選單製作

載入js庫檔案,可到官方網站下載,這裡提供的是jquery-1.1.3.1.min.js和jquery.easing.min.js庫檔案。

滑鼠經過動畫選單製作

在style資料夾下面放入圖片素材,在HTML檔案中呼叫。

滑鼠經過動畫選單製作

滑鼠經過動畫選單製作

最後開啟index.htm檔案,測試,完成。

滑鼠經過動畫選單製作

注意事項

製作過程不復雜,js檔案很關鍵,不懂請詳閱官方文件。

整個例項供大家學習,參考使用。

效果, 滑鼠, 動畫, 選單,
相關問題答案