自定义鼠标右键样式

最新推荐文章于 2024-09-13 00:58:37 发布

一只小菜鳥

最新推荐文章于 2024-09-13 00:58:37 发布

阅读量394

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/Keep_Slience/article/details/114290941

JavaScript 专栏收录该内容

11 篇文章

订阅专栏

今天碰到一个需求就是要在鼠标右键点击的时候出现自定义选项卡，话不多说直接附上代码

首先先写一个列表

<ul class="ul" style="display:none;position:absolute">
      <li>
        <a href="javascript:;">关闭当前</a>
      </li>
      <li id="close-all">
        <a href="javascript:;">关闭全部</a>
      </li>
      <li id="close-other">
        <a href="javascript:;">关闭其他</a>
      </li>
 </ul>

js代码

document.oncontextmenu=function(e){
	var event = window.evnent ||e 
	if(event.preventDefault) {
		event.preventDefault()//阻止右键点击的默认行为
	} else {
		event.returnValue = false //ie浏览器
	}
	var top = event.clientY + "px";//距离顶部距离
	var left = event.clientX + "px";
	$('.ul').css({"top":top,"left":left})show()
}