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 相关文章推荐
Ucren Virtual Desktop V2.0
Nov 07 Javascript
Open and Print a Word Document
Jun 15 Javascript
在JavaScript中重写jQuery对象的方法实例教程
Aug 25 Javascript
jQuery+css实现的时钟效果(兼容各浏览器)
Jan 27 Javascript
JS iFrame加载慢怎么解决
May 13 Javascript
ionic cordova一次上传多张图片(类似input file提交表单)的实现方法
Dec 16 Javascript
Node.js的特点详解
Feb 03 Javascript
ECMAScript6 新特性范例大全
Mar 24 Javascript
基于JavaScript实现的希尔排序算法分析
Apr 14 Javascript
JS实现微信里判断页面是否被分享成功的方法
Jun 06 Javascript
vue init失败简单解决方法(终极版)
Dec 22 Javascript
Vue项目服务器部署之子目录部署方法
May 12 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
discuz的php防止sql注入函数
2011/01/17 PHP
如何使用Linux的Crontab定时执行PHP脚本的方法
2011/12/19 PHP
如何用C语言编写PHP扩展的详解
2013/06/13 PHP
给大家分享几个常用的PHP函数
2017/01/15 PHP
JavaScript数值转换的三种方式总结
2014/07/31 Javascript
jQuery对val和atrr(&quot;value&quot;)赋值的区别介绍
2014/09/26 Javascript
浅谈Javascript变量作用域问题
2014/12/16 Javascript
JavaScript之Object类型介绍
2015/04/01 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
2016/11/02 Javascript
纯js三维数组实现三级联动效果
2017/02/07 Javascript
JS常用倒计时代码实例总结
2017/02/07 Javascript
Vue组件之全局组件与局部组件的使用详解
2017/10/09 Javascript
从零开始搭建一个react项目开发
2018/02/09 Javascript
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
2019/10/11 Javascript
vue element自定义表单验证请求后端接口验证
2019/12/11 Javascript
js实现简单的秒表
2020/01/16 Javascript
使用setup.py安装python包和卸载python包的方法
2013/11/27 Python
Python Paramiko模块的安装与使用详解
2016/11/18 Python
python3使用smtplib实现发送邮件功能
2018/05/22 Python
matplotlib 纵坐标轴显示数据值的实例
2018/05/25 Python
解读python如何实现决策树算法
2018/10/11 Python
django如何通过类视图使用装饰器
2019/07/24 Python
python中的global关键字的使用方法
2019/08/20 Python
Python类中方法getitem和getattr详解
2019/08/30 Python
Python 使用元类type创建类对象常见应用详解
2019/10/17 Python
Python : turtle色彩控制实例详解
2020/01/19 Python
Python多进程编程multiprocessing代码实例
2020/03/12 Python
CSS3 分类菜单效果
2019/05/27 HTML / CSS
介绍一下linux文件系统分配策略
2013/02/25 面试题
解决python 输出到csv 出现多空行的情况
2021/03/24 Python
机械电子工程毕业生自荐信
2013/11/23 职场文书
药学专业大专生的自我评价
2013/12/12 职场文书
千手观音观后感
2015/06/03 职场文书
Go各时间字符串使用解析
2021/04/02 Golang
python 实现的截屏工具
2021/05/08 Python
PostgreSQL逻辑复制解密原理解析
2022/09/23 PostgreSQL