鼠標點擊事件(屏蔽右鍵菜單,彈出自定義菜單)


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
/*跟運動相關的模塊都需要絕對定位*/
#idv1 {background: #CCCCCC;display: none;width: 50px;position: absolute;}
</style>
<script>

//鼠標右鍵默認菜單事件
document.oncontextmenu = function(ev) {
var oevent = ev || event;

var div1 = document.getElementById('idv1');
//彈出自定義菜單
div1.style.display = 'block';
//設置自定義菜單的坐標,達到鼠標右鍵的地方彈出自定義菜單
div1.style.left = oevent.clientX + 'px';
div1.style.top = oevent.clientY + 'px';

//屏蔽右鍵默認菜單
return false;
}
//點擊頁面任一地方,收起自定義菜單
document.onclick = function() {
var div1 = document.getElementById('idv1');
div1.style.display = 'none';
}
</script>
</head>

<body>
<div id="idv1">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</div>
</body>

</html>


注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
粤ICP备14056181号  © 2014-2021 ITdaan.com