左键弹出式菜单

最新推荐文章于 2021-06-09 19:27:05 发布

转载最新推荐文章于 2021-06-09 19:27:05 发布 · 63 阅读

·

0

·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/you-zi/articles/4535946.html

文章标签：

#javascript #ViewUI

本文介绍了一种使用HTML和JavaScript创建弹出菜单的方法。通过在HTML中定义隐藏的表格元素并在JavaScript中添加鼠标点击事件来控制显示与隐藏，实现了简单的上下文菜单功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<style type="text/css">
body{font: 9pt "宋体"; margintop: 0px ; color:
#ffffff; background: #000000}
a.{ font: 9pt "宋体"; cursor: hand; font-size:
9pt ; color: #ffffff; text-decoration: none }
a:active{ font: 9pt "宋体";
cursor: hand; color: #FF0033 }
a.cc:hover{ font: 9pt "宋体"; cursor: hand;
color: #FF0033}
.box{ font: 9pt "宋体"; position: absolute; background: #000000
}
</style>

====2、将以下代码加入到HEML的<body></body>之间：

<table
id="itemopen" class="box"
style="display:none">
<tr>
<td>弹出菜单</td>
</tr>
<tr>
<td><a
href="../../../index.html"
class="cc">本站首页</a></td>
</tr>
<tr>
<td><a
href="../../navigation/newscript.htm"
class="cc">最新更新</a></td>
</tr>
<tr>
<td><a
href="../../navigation/applet/appletindex.htm"
class="cc">梦想软件</a></td>
</tr>
<tr>
<td><a
href="../../../jsschool/index.htm"
class="cc">桌面壁纸</a></td>
</tr>
<tr>
<td><a
href="popmenu.htm"
class="cc">更多连接</a></td>
</tr>
<tr>
<td><a
href="popmenu.htm"
class="cc">更多连接</a></td>
</tr>
<tr>
<td><a
href="popmenu.htm"
class="cc">更多连接</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>

转载于:https://www.cnblogs.com/you-zi/articles/4535946.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。