在網(wǎng)頁(yè)的任意處點(diǎn)擊左鍵就會(huì)彈出來(lái)，實(shí)際上是用JS控制DIV層的顯示，DIV層內(nèi)嵌套的是一個(gè)表格，表格里放菜單，這樣修改方便，不會(huì)CSS也沒(méi)關(guān)系，你可以把它復(fù)制下來(lái)，用DW打開(kāi)重新修改一下菜單樣式，換成你自己喜歡的色彩

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>隱藏菜單</title>
<style type="text/css">
body {
 font: 9pt;
}
.box {
 font: 9pt "宋體";
 position: absolute;
 background: skyblue;
}
</style>
</head>
<body>
<table cellpadding="5" id="itemopen" class="box" style="display:none">
 <tr>
  <td bgcolor="#0066cc">網(wǎng)站導(dǎo)航：</td>
 </tr>
<tr>
  <td><a href="/">AJAX實(shí)例</a></td>
 </tr>
 <tr>
  <td><a href="/jscss/">jQuery相關(guān)</a></td>
 </tr>
 <tr>
  <td><a href="/jscss/">ExtJS演示</a></td>
 </tr>
</table>
</center>
</div>
<script language="JavaScript">
document.onclick = popUp 
function popUp() {
newX = window.event.x + document.body.scrollLeft
newY = window.event.y + document.body.scrollTop
menu = document.all.itemopen
 if ( menu.style.display == ""){
  menu.style.display = "none" }
 else {
   menu.style.display = ""}
  menu.style.pixelLeft = newX - 50
  menu.style.pixelTop = newY - 50
}
</script>
<body>
<p align="center"><font size="3">點(diǎn)擊左鍵看看？</p>
</body>
</html>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

KnockoutJS 3.X API 第四章之?dāng)?shù)據(jù)控制流if綁定和ifnot綁定
這篇文章主要介紹了KnockoutJS 3.X API 第四章之?dāng)?shù)據(jù)控制流if綁定和ifnot綁定的相關(guān)資料,需要的朋友可以參考下
2016-10-10
小程序?qū)崿F(xiàn)分類頁(yè)
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)好看的分類頁(yè)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-07-07
Js代碼中的span拼接問(wèn)題解決
這篇文章主要介紹了Js代碼中的span拼接問(wèn)題解決,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2019-11-11
JS+html5 canvas實(shí)現(xiàn)的簡(jiǎn)單繪制折線圖效果示例
這篇文章主要介紹了JS+html5 canvas實(shí)現(xiàn)的簡(jiǎn)單繪制折線圖效果,結(jié)合實(shí)例形式分析了js結(jié)合HTML5 canvas技術(shù)實(shí)現(xiàn)圖形繪制的數(shù)值運(yùn)算與數(shù)組遍歷等操作技巧,需要的朋友可以參考下
2017-03-03
web 屏蔽BackSpace鍵實(shí)例代碼
在web端，輸入的時(shí)候，很容易在文本框消失焦點(diǎn)的時(shí)候，點(diǎn)擊退格鍵，頁(yè)面就回退了，下面是一種屏蔽頁(yè)面回退鍵的方法,一起看看吧
2016-12-12
使用impress.js制作幻燈片
impress.js是一款新興的幻燈工具，它的效果類似Prezi，但是擁有3D的功能，而且是在MIT&GPL協(xié)議下開(kāi)源，對(duì)于有一定的Web開(kāi)發(fā)基礎(chǔ)的人而言，真是一個(gè)福音，只需要簡(jiǎn)單的用些html指令，并加載impress.js就可以制作出一個(gè)縮放式幻燈，朋友們感興趣吧，快來(lái)一起學(xué)習(xí)吧。
2015-09-09
解決layui動(dòng)態(tài)添加的元素click等事件觸發(fā)不了的問(wèn)題
今天小編就為大家分享一篇解決layui動(dòng)態(tài)添加的元素click等事件觸發(fā)不了的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2019-09-09
javascript （用setTimeout而非setInterval）
javascript （用setTimeout而非setInterval）如果用setInterval 可能出現(xiàn) 下次調(diào)用會(huì)在前一次調(diào)用前調(diào)用
2011-12-12
微信小程序自定義音樂(lè)進(jìn)度條的實(shí)例代碼
最近遇到這樣的需求：顯示音樂(lè)播放按鈕、可手動(dòng)拖拽進(jìn)度條；頁(yè)面中含多個(gè)音樂(lè)，播放當(dāng)前音樂(lè)時(shí)暫停其他音樂(lè)播放。這篇文章主要介紹了微信小程序自定義音樂(lè)進(jìn)度條的實(shí)例代碼,需要的朋友可以參考下
2018-08-08
HTML+CSS+JavaScript做女朋友版的刮刮樂(lè)(一看就會(huì))
這篇文章主要介紹了HTML+CSS+JavaScript做女朋友版的刮刮樂(lè)(一看就會(huì))本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2021-08-08