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程序设计有所帮助。

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
You might like
ThinkPHP 3.2 版本升级了哪些内容
2015/03/05 PHP
php中 $$str 中 &quot;$$&quot; 的详解
2015/07/06 PHP
PHP自毁程序(慎用)
2015/07/09 PHP
Symfony2安装第三方Bundles实例详解
2016/02/04 PHP
php htmlentities()函数的定义和用法
2016/05/13 PHP
PHP屏蔽关键字实现方法
2016/11/17 PHP
PHP实现判断数组是一维、二维或几维的方法
2017/02/06 PHP
php+Memcached实现简单留言板功能示例
2017/02/15 PHP
PHP中使用CURL发送get/post请求上传图片批处理功能
2018/10/15 PHP
jquery+json实现的搜索加分页效果
2010/03/31 Javascript
extjs两个tbar问题探讨
2013/08/08 Javascript
理解Javascript图片预加载
2016/02/23 Javascript
javascript HTML5文件上传FileReader API
2020/03/27 Javascript
Ajax实现不刷新取最新商品
2017/03/01 Javascript
vue-quill-editor实现图片上传功能
2017/08/08 Javascript
在Vue methods中调用filters里的过滤器实例
2018/08/30 Javascript
layer设置maxWidth及maxHeight解决方案
2019/07/26 Javascript
使用Node.js实现base64和png文件相互转换的方法
2020/03/11 Javascript
如何使用JavaScript检测空闲的浏览器选项卡
2020/05/28 Javascript
基于javascript处理nginx请求过程详解
2020/07/07 Javascript
原生js实现照片墙效果
2020/10/13 Javascript
Python中的类与对象之描述符详解
2015/03/27 Python
详解Python3中setuptools、Pip安装教程
2019/06/18 Python
FFrpc python客户端lib使用解析
2019/08/24 Python
python SocketServer源码深入解读
2019/09/17 Python
Python Django中的STATIC_URL 设置和使用方式
2020/03/27 Python
详解python算法常用技巧与内置库
2020/10/17 Python
Java基础类库面试题
2013/09/04 面试题
工程总经理工作职责
2013/12/09 职场文书
党的群众路线教育实践活动动员会主持词
2014/03/20 职场文书
感恩老师的演讲稿
2014/05/06 职场文书
争做文明公民倡议书
2014/08/29 职场文书
基层党支部整改方案
2014/10/25 职场文书
西安导游词
2015/02/12 职场文书
2019如何书写演讲稿?
2019/07/01 职场文书
Apache自带的ab压力测试工具的实现
2022/07/23 Servers