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 相关文章推荐
ie和firefox不兼容的解决方法集合
Apr 28 Javascript
图片上传即时显示缩略图的js代码
May 27 Javascript
node.js正则表达式获取网页中所有链接的代码实例
Jun 03 Javascript
Javascript正则控制文本框只能输入整数或浮点数
Sep 02 Javascript
node.js中的fs.openSync方法使用说明
Dec 17 Javascript
jQuery实现自定义右键菜单的树状菜单效果
Sep 02 Javascript
js ajaxfileupload.js上传报错的解决方法
May 05 Javascript
Bootstrap实现水平排列的表单
Jul 04 Javascript
对js eval()函数的一些见解
Aug 15 Javascript
基于vue-video-player自定义播放器的方法
Mar 21 Javascript
在Vue中使用antv的示例代码
Jun 29 Javascript
通过实例解析jQ Ajax操作相关原理
Sep 23 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
PHP初学者头疼问题总结
2006/07/08 PHP
深入php中var_dump方法的使用详解
2013/06/24 PHP
php使用pear_smtp发送邮件
2016/04/15 PHP
php注册审核重点解析(数据访问)
2017/05/23 PHP
PHP从零开始打造自己的MVC框架之类的自动加载实现方法详解
2019/06/03 PHP
Yii2.0框架模型添加/修改/删除数据操作示例
2019/07/18 PHP
return false;和e.preventDefault();的区别
2010/07/11 Javascript
JS实现日期加减的方法
2013/11/29 Javascript
js的hasownproperty使用示例
2014/03/02 Javascript
Javascript 运动中Offset的bug解决方案
2014/12/24 Javascript
运行Node.js的IIS扩展iisnode安装配置笔记
2015/03/02 Javascript
javascript精确统计网站访问量实例代码
2015/12/19 Javascript
JS简单获取及显示当前时间的方法
2016/08/03 Javascript
详解angular笔记路由之angular-router
2017/09/12 Javascript
vue.js动画中的js钩子函数的实现
2018/07/06 Javascript
vue展示dicom文件医疗系统的实现代码
2018/08/27 Javascript
Vue+penlayers实现多边形绘制及展示
2020/12/24 Vue.js
Python内置函数的用法实例教程
2014/09/08 Python
python xml解析实例详解
2016/11/14 Python
Python合并字典键值并去除重复元素的实例
2016/12/18 Python
基于python的多进程共享变量正确打开方式
2018/04/28 Python
Tensorflow实现AlexNet卷积神经网络及运算时间评测
2018/05/24 Python
python实现整数的二进制循环移位
2019/03/08 Python
Python3 翻转二叉树的实现
2019/09/30 Python
如何基于pandas读取csv后合并两个股票
2020/09/25 Python
UGG雪地靴荷兰官网:UGG荷兰
2016/09/09 全球购物
《水上飞机》教学反思
2014/04/10 职场文书
解除财产保全担保书
2014/05/20 职场文书
办公室文员工作自我鉴定
2014/09/19 职场文书
专升本学生毕业自我鉴定
2014/10/04 职场文书
质量保证书怎么写
2015/02/27 职场文书
员工升职自荐信
2015/03/27 职场文书
培训讲师开场白
2015/06/01 职场文书
海上钢琴师的观后感
2015/06/11 职场文书
python playwright 自动等待和断言详解
2021/11/27 Python
Python OpenCV实现图形检测示例详解
2022/04/08 Python