javascriptカスタム右クリックメニューコード
13816 ワード
javascriptカスタム右クリックメニューコード:
右ボタンメニューはこれがもっと詳しいですが、パソコンを使うと毎日ほぼ千回右クリックメニューを操作します.次はユーザー定義の右ボタンメニューのコード例を共有します.関連した内容が必要な友達に助けを与えたいです.コードの例は以下の通りです.
原文の住所は:http://www.51texiao.cn/javascriptjiaocheng/2015/0507/885.html
最初の住所は:http://www.softwhy.com/forum.php?mod=viewthread&tid=8097
右ボタンメニューはこれがもっと詳しいですが、パソコンを使うと毎日ほぼ千回右クリックメニューを操作します.次はユーザー定義の右ボタンメニューのコード例を共有します.関連した内容が必要な友達に助けを与えたいです.コードの例は以下の通りです.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51texiao.cn/" />
<title> </title>
<style type="text/css">
#d1{
width:100px;
height:200px;
background-color:green;
display:none;
}
#dl a{
display:block;
}
</style>
<script type="text/javascript">
window.onload=function(){
rightmenu('p1','d1');
}
function rightmenu(elementID,menuID){
var menu=document.getElementById(menuID); //
var element=document.getElementById(elementID);//
element.onmousedown=function(aevent)
{ //
if(window.event)aevent=window.event; //
if(aevent.button==2)
{ // button 2 ,
document.oncontextmenu=function(aevent)
{
if(window.event)
{
aevent=window.event;
aevent.returnValue=false; // IE
}
else
{
aevent.preventDefault(); // DOM
}
}
menu.style.cssText='display:block;top:'+aevent.clientY+'px;'+'left:'+aevent.clientX+'px;'
//
}
}
menu.onmouseout=function()
{ //
setTimeout(function(){menu.style.display="none";},400);
}
}
</script>
</head>
<body>
<p id="p1"> </p>
<div id="d1">
<a> </a>
<a> </a>
<a> </a>
</div>
</body>
</html>
以上のコードは基本的に必要な効果を実現します.もちろんまだ十分ではありません.自分で改善すればいいです.ただ一つの考えを提供しました.原文の住所は:http://www.51texiao.cn/javascriptjiaocheng/2015/0507/885.html
最初の住所は:http://www.softwhy.com/forum.php?mod=viewthread&tid=8097