2015年3月1日 星期日

jQuery - Sliding Image Menu (1)

jQuery Sliding Image Menu需在<head></head>網頁標籤部份匯入以下js檔案:
  • jquery-2.1.0.min.js
  • jquery.bgImageMenu.js
  • jquery.easing.js
其程式如下所示:
 



...
並以JavaScript設定預設Menu的背景圖片:
  
...
接著以<div></div>網頁標籤設定Sliding Image Menu選項:

【執行結果】

當以滑鼠移至Sliding Image Menu上方時,將顯示選單,此外背景圖片會隨著選單之不同而自動更新:
【參考資料】

[1] jQuery:http://jquery.com

© Chia-Hui Huang

沒有留言:

張貼留言