JavaScript CSS創(chuàng)建右擊菜單效果代碼
更新時間:2008年12月02日 15:02:52 作者:
右擊菜單效果
效果圖:

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
代碼解釋:
1、 在頁面載入時,先執(zhí)行l(wèi)oad1()方法
首先檢驗是不是IE瀏覽器,如果當(dāng)前瀏覽器是Internet Explorer,document.all就返回真。則下面的定義就應(yīng)該有效。也就是說當(dāng)檢查到客戶端使用的瀏覽器是IE的時候那么當(dāng)用戶產(chǎn)生右鍵事件時就調(diào)用函數(shù) showmenuie5,當(dāng)用戶產(chǎn)生左鍵事件時就調(diào)用函數(shù)hidemenuie5。
2、接著我們要考慮如何通過函數(shù)showmenuie5和函數(shù)hidemenuie5來實現(xiàn)菜單的顯示和隱藏。
當(dāng)然,這里的菜單并不是真正意義的右鍵菜單,而是我們自己做的一個div,在這個div中裝上我們想要裝的東西。通過鼠標(biāo)事件調(diào)用函數(shù)來控制它的顯隱,這就達到了使用鼠標(biāo)右鍵一樣的效果了。
這一塊的最外層是一個id為ie5menu的div,我們定義了它的樣式為skin0,你也可以根據(jù)自定義其他樣式,然后替換skin0。
3、點擊菜單選項后的操作
jumptoie5()函數(shù)實現(xiàn)鼠標(biāo)點擊右鍵菜單中的層時發(fā)生的事情,也就是執(zhí)行選項

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
代碼解釋:
1、 在頁面載入時,先執(zhí)行l(wèi)oad1()方法
首先檢驗是不是IE瀏覽器,如果當(dāng)前瀏覽器是Internet Explorer,document.all就返回真。則下面的定義就應(yīng)該有效。也就是說當(dāng)檢查到客戶端使用的瀏覽器是IE的時候那么當(dāng)用戶產(chǎn)生右鍵事件時就調(diào)用函數(shù) showmenuie5,當(dāng)用戶產(chǎn)生左鍵事件時就調(diào)用函數(shù)hidemenuie5。
2、接著我們要考慮如何通過函數(shù)showmenuie5和函數(shù)hidemenuie5來實現(xiàn)菜單的顯示和隱藏。
當(dāng)然,這里的菜單并不是真正意義的右鍵菜單,而是我們自己做的一個div,在這個div中裝上我們想要裝的東西。通過鼠標(biāo)事件調(diào)用函數(shù)來控制它的顯隱,這就達到了使用鼠標(biāo)右鍵一樣的效果了。
這一塊的最外層是一個id為ie5menu的div,我們定義了它的樣式為skin0,你也可以根據(jù)自定義其他樣式,然后替換skin0。
3、點擊菜單選項后的操作
jumptoie5()函數(shù)實現(xiàn)鼠標(biāo)點擊右鍵菜單中的層時發(fā)生的事情,也就是執(zhí)行選項
相關(guān)文章
超酷的鼠標(biāo)拖拽翻頁(分頁)效果實現(xiàn)javascript代碼
超酷的鼠標(biāo)拖拽翻頁(分頁)效果實現(xiàn)javascript代碼,非常的不錯。2009-09-09Div+Js實現(xiàn)的帶陰影菜單 微軟以前網(wǎng)站曾用過
Div+Js實現(xiàn)的陰影菜單,微軟以前老版網(wǎng)站首頁曾用過,用以索引出Windows產(chǎn)品家族的所有產(chǎn)品,本菜單僅實現(xiàn)了一個雛形,想實現(xiàn)像微軟一樣的效果,估計還需要做不少工作。放出來的目的是供學(xué)習(xí)CSS的朋友做參考。2009-12-12