JS自定义鼠标右键内容

最新推荐文章于 2023-05-30 15:06:33 发布

罗章钱

最新推荐文章于 2023-05-30 15:06:33 发布

阅读量1k

点赞数

分类专栏： javascript 文章标签： class url function javascript ie html

javascript 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

本文介绍了一种使用HTML、CSS和JavaScript实现自定义鼠标右键菜单的方法。通过设置特定的样式和脚本，可以在浏览器中创建一个带有多个选项的浮动菜单，当用户右击页面时显示，并能跳转到不同的链接。

摘要由CSDN通过智能技术生成

代码如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>鼠标右键更换</title>

<style type="text/css">
<!--
.cMenu {
position: absolute;
visibility:hidden;
color:#000000;
width:150px;
border:2px dashed #999999;
background-color:#f0f0f0;
font-size:9pt;
line-height:18px;
cursor:default;
filter: Alpha(Opacity=80);
}

.menuitems {
padding-left:15px;
padding-right:10px;
}
-->
</style>

<SCRIPT LANGUAGE="JavaScript">
// RightClickMenu

function showmenuie5(){
var rightedge=document.body.clientWidth-event.clientX
var bottomedge=document.body.clientHeight-event.clientY
if (rightedge<ie5menu.offsetWidth)
   ie5menu.style.left=document.body.scrollLeft+event.clientX-ie5menu.offsetWidth
else
   ie5menu.style.left=document.body.scrollLeft+event.clientX
if (bottomedge<ie5menu.offsetHeight)
   ie5menu.style.top=document.body.scrollTop+event.clientY-ie5menu.offsetHeight
else
   ie5menu.style.top=document.body.scrollTop+event.clientY
ie5menu.style.visibility="visible"
return false
}
function hidemenuie5(){
ie5menu.style.visibility="hidden"
}
function highlightie5(){
if (event.srcElement.className=="menuitems"){
   event.srcElement.style.backgroundColor="highlight"
   event.srcElement.style.color="white"
}
}
function lowlightie5(){
if (event.srcElement.className=="menuitems"){
   event.srcElement.style.backgroundColor=""
   event.srcElement.style.color="black"
}
}
function jumptoie5(){
if (event.srcElement.className=="menuitems"){
   if (event.srcElement.url != ''){
    if (event.srcElement.getAttribute("target")!=null)
     window.open(event.srcElement.url,event.srcElement.getAttribute("target"))
    else
     window.location=event.srcElement.url
   }
}
}

</SCRIPT>
</head>
<body>

<RightClick>

<script language="JavaScript">

</script>
</RightClick>

</body>
</html>