javascript实现在网页任意处点左键弹出隐藏菜单的方法
作者:bea
在网页的任意处点击左键就会弹出来,实际上是用JS控制DIV层的显示,DIV层内嵌套的是一个表格,表格里放菜单,这样修改方便,不会CSS也没关系,你可以把它复制下来,用DW打开重新修改一下菜单样式,换成你自己喜欢的色彩 <html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>隐藏菜单</title>
在网页的任意处点击左键就会弹出来,实际上是用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实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
- JS实现简洁、全兼容的拖动层实例
- javascript实现图片跟随鼠标移动效果的方法
- javascript鼠标滑动评分控件完整实例
- javascript实现链接单选效果的方法
- javascript实现table选中的行以指定颜色高亮显示的方法
- javascript实现table表格隔行变色的方法
- javascript模拟评分控件实现方法
- javascript动态设置样式style实例分析
- javascript事件冒泡实例分析
- javascript无刷新评论实现方法
- javascript动态创建表格及添加数据实例详解
- javascript动态创建链接的方法
- javascript中innerText和innerHTML属性用法实例分析
- javascript元素动态创建实现方法
- javascript实现模拟时钟的方法
- javascript实现点击后变换按钮显示文字的方法
- javascript实现十秒钟后注册按钮可点击的方法
- javascript中clipboardData对象用法详解