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 相关文章推荐
this[] 指的是什么内容 讨论
Mar 24 Javascript
学习jquery必备 api中英文对照的chm手册 下载
May 03 Javascript
几种经典排序算法的JS实现方法
Mar 25 Javascript
JavaScript判断数组重复内容的两种方法(推荐)
Jun 06 Javascript
javascript中href和replace的比较(详解)
Nov 25 Javascript
浅谈JavaScript中的属性:如何遍历属性
Sep 14 Javascript
集合Bootstrap自定义confirm提示效果
Sep 19 Javascript
将jquery.qqFace.js表情转换成微信的字符码
Dec 01 jQuery
JavaScript 中使用 Generator的方法
Dec 29 Javascript
Vue中使用better-scroll实现轮播图组件
Mar 07 Javascript
javascript绘制简单钟表效果
Apr 07 Javascript
openlayers4.6.5实现距离量测和面积量测
Sep 25 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
ajax+php打造进度条 readyState各状态
2010/03/20 PHP
php将fileterms函数返回的结果变成可读的形式
2011/04/21 PHP
浅谈PHP强制类型转换,慎用!
2013/06/06 PHP
简单谈谈php浮点数精确运算
2016/03/10 PHP
php实现水印文字和缩略图的方法示例
2016/12/29 PHP
juqery 学习之三 选择器 层级 基本
2010/11/25 Javascript
js捕获鼠标滚轮事件代码
2013/12/16 Javascript
jquery中EasyUI实现同步树
2015/03/01 Javascript
解决jquery无法找到其他父级子集问题的方法
2016/05/10 Javascript
值得分享的轻量级Bootstrap Table表格插件
2016/05/30 Javascript
JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
2016/06/02 Javascript
Vue组件开发初探
2017/02/14 Javascript
AngularJS constant和value区别详解
2017/02/28 Javascript
详解vue.js的devtools安装
2017/05/26 Javascript
vue.js源代码core scedule.js学习笔记
2017/07/03 Javascript
Vue项目引进ElementUI组件的方法
2018/11/11 Javascript
Javascript Dom元素获取和添加详解
2019/09/24 Javascript
Python 文件操作技巧(File operation) 实例代码分析
2008/08/11 Python
python读文件逐行处理的示例代码分享
2013/12/27 Python
Python函数的周期性执行实现方法
2016/08/13 Python
Python 记录日志的灵活性和可配置性介绍
2018/02/27 Python
Python实现常见的回文字符串算法
2018/11/14 Python
详解js文件通过python访问数据库方法
2019/03/03 Python
Python使用到第三方库PyMuPDF图片与pdf相互转换
2019/05/03 Python
Django使用中间件解决前后端同源策略问题
2019/09/02 Python
Django配置文件代码说明
2019/12/04 Python
py-charm延长试用期限实例
2019/12/22 Python
公益广告语集锦
2014/03/13 职场文书
高二学年自我鉴定范文(2篇)
2014/09/26 职场文书
2014大学生学生会工作总结
2014/12/19 职场文书
环卫工人慰问信
2015/02/15 职场文书
2015年全国科普日活动总结
2015/03/23 职场文书
入党宣誓大会后的感想
2015/08/10 职场文书
运动会班级口号霸气押韵
2015/12/24 职场文书
浅谈Python数学建模之固定费用问题
2021/06/23 Python
一文彻底理解js原生语法prototype,__proto__和constructor
2021/10/24 Javascript