编程 Javascript

javascript实现在网页任意处点左键弹出隐藏菜单的方法

Posted in Javascript onMay 13, 2015

在网页的任意处点击左键就会弹出来，实际上是用JS控制DIV层的显示，DIV层内嵌套的是一个表格，表格里放菜单，这样修改方便，不会CSS也没关系，你可以把它复制下来，用DW打开重新修改一下菜单样式，换成你自己喜欢的色彩

<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">网站导航：</td>
 </tr>
<tr>
  <td><a href="/">AJAX实例</a></td>
 </tr>
 <tr>
  <td><a href="/jscss/">jQuery相关</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">点击左键看看？</p>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

- Author -

shichen2014

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

海量经典的jQuery插件集合

Jan 12 Javascript

IE6图片加载的一个BUG解决方法

Jul 13 Javascript

JavaScript字符串对象replace方法实例（用于字符串替换或正则替换）

Oct 16 Javascript

jQuery中replaceWith()方法用法实例

Dec 25 Javascript

JS+CSS实现鼠标滑过时动态翻滚的导航条效果

Sep 24 Javascript

使用 JavaScript 进行函数式编程 (一) 翻译

Oct 02 Javascript

javascript实现Email邮件显示与删除功能

Nov 21 Javascript

web.js.字符串与正则表达式操作

May 13 Javascript

详解nvm管理多版本node踩坑

Jul 26 Javascript

Element Dialog对话框的使用示例

Jul 26 Javascript

js实现移动端图片滑块验证功能

Sep 29 Javascript

JS的深浅复制详细

Oct 16 Javascript

浅谈jQuery中replace()方法

May 13 #Javascript

js实现仿Windows风格选项卡和按钮效果实例

May 13 #Javascript

JS实现模拟风力的雪花飘落效果

May 13 #Javascript

JavaScript实现鼠标点击后层展开效果的方法

May 13 #Javascript

浅谈javascript中的闭包

May 13 #Javascript

jQuery构造函数init参数分析续

May 13 #Javascript

jQuery构造函数init参数分析

May 13 #Javascript