jquery 简短右键菜单 多浏览器兼容


Posted in Javascript onJanuary 01, 2010
$(function(){ 
document.oncontextmenu=function(){return false;}//屏蔽右键 
document.onmousemove=mouseMove;//记录鼠标位置 
}); 
var mx=0,my=0; 
function mouseMove(ev){Ev=ev||window.event;var mousePos=mouseCoords(Ev);mx=mousePos.x;my=mousePos.y;} 
function mouseCoords(ev){ 
if(ev.pageX||ev.pageY){return{x:ev.pageX,y:ev.pageY};} 
return{x:ev.clientX,y:ev.clientY+$(document).scrollTop()}; 
} $.fn.extend({RightMenu: function(id,options){options = $.extend({menuList:[]},options);var menuCount=options.menuList.length; 
if (!$("#"+id)[0]){ 
var divMenuList="<div id=\""+id+"\" class=\"div_RightMenu\"><div><ul class='ico'>"; 
for(var i=0;i<menuCount;i++){ 
divMenuList+="<li class=\"RMli_"+options.menuList[i].menuclass+"\" onclick=\""+options.menuList[i].clickEvent+"\">"+options.menuList[i].menuName+"</li>"; 
} 
divMenuList += "</ul></div><div>"; 
$("body").append(divMenuList).find("#"+id).hide().find("li") 
.bind("mouseover",function(){$(this).addClass("RM_mouseover");}) 
.bind("mouseout",function(){$(this).removeClass("RM_mouseover");}); 
$(document).click(function(){$("#"+id).hide();}); 
} 
return this.each(function(){ 
this.oncontextmenu=function(){ 




/*这段 判断鼠标移到页面的最右侧或者最下侧 防止出现滚动条 {*/ 
var mw=$('body').width(),mhh=$('html').height(),mbh=$('body').height(), 
w=$('#'+id).width(),h=$('#'+id).height(), 
mh=(mhh>mbh)?mhh:mbh;//最大高度 比较html与body的高度 
if(mh<h+my){my=mh-h;}//超 高 
if(mw<w+mx){mx=mw-w;}//超 宽 



/*} 当然也可以直接跳过*/ 
$("#"+id).hide().css({top:my,left:mx}).show(); 
} 
}); 
} 
});

在线演示 右键点击测试效果

打包下载

Javascript 相关文章推荐
document.designMode的功能与使用方法介绍
Nov 22 Javascript
IE和Firefox在JavaScript应用中的兼容性探讨
Apr 01 Javascript
jquery 操作DOM案例代码分享
Apr 05 Javascript
无闪烁更新网页内容JS实现
Dec 19 Javascript
express的中间件bodyParser详解
Dec 04 Javascript
Javascript 拖拽雏形中的一些问题(逐行分析代码,让你轻松了拖拽的原理)
Jan 23 Javascript
Underscore源码分析
Dec 30 Javascript
JavaScript简单实现弹出拖拽窗口(一)
Jun 17 Javascript
jQuery实现对象转为url参数的方法
Jan 11 Javascript
Django+Vue跨域环境配置详解
Jul 06 Javascript
js tab栏切换代码实例解析
Sep 03 Javascript
swiper Scrollbar滚动条组件详解
Sep 08 Javascript
使用JQUERY Tabs插件宿主IFRAMES
Jan 01 #Javascript
用jquery实现学校的校历(asp.net+jquery ui 1.72)
Jan 01 #Javascript
url 特殊字符 传递参数解决方法
Jan 01 #Javascript
JavaScript 数组循环引起的思考
Jan 01 #Javascript
javascript eval和JSON之间的联系
Dec 31 #Javascript
js下用gb2312编码解码实现方法
Dec 31 #Javascript
JavaScript 学习笔记(七)字符串的连接
Dec 31 #Javascript
You might like
谈谈PHP语法(5)
2006/10/09 PHP
用PHP制作静态网站的模板框架(三)
2006/10/09 PHP
真正的ZIP文件操作类(php)
2007/07/21 PHP
PHP 文件上传功能实现代码
2009/06/24 PHP
php 错误处理经验分享
2011/10/11 PHP
Php图像处理类代码分享
2012/01/19 PHP
PHP实现HTML页面静态化的方法
2015/11/04 PHP
php使用ffmpeg向视频中添加文字字幕的实现方法
2016/05/23 PHP
ThinkPHP实现简单登陆功能
2017/04/28 PHP
Jquery选中或取消radio示例
2013/09/29 Javascript
JQuery获取表格数据示例代码
2014/05/26 Javascript
jQuery版本升级踩坑大全
2016/01/12 Javascript
基于JavaScript短信验证码如何实现
2016/01/24 Javascript
bootstrap模态框跳转到当前模板页面 框消失了而背景存在问题的解决方法
2020/11/30 Javascript
AngularJS实时获取并显示密码的方法
2018/02/06 Javascript
vuex进阶知识点巩固
2018/05/20 Javascript
vue中各选项及钩子函数执行顺序详解
2018/08/25 Javascript
vee-validate vue 2.0自定义表单验证的实例
2018/08/28 Javascript
微信小程序人脸识别功能代码实例
2019/05/07 Javascript
记一次react前端项目打包优化的方法
2020/03/30 Javascript
vue 百度地图(vue-baidu-map)绘制方向箭头折线实例代码详解
2020/04/28 Javascript
Python 解析XML文件
2009/04/15 Python
Python双精度浮点数运算并分行显示操作示例
2017/07/21 Python
Python基于socket实现简单的即时通讯功能示例
2018/01/16 Python
使用python打印十行杨辉三角过程详解
2019/07/10 Python
pytorch程序异常后删除占用的显存操作
2020/01/13 Python
python3 实现口罩抽签的功能
2020/03/11 Python
Otticanet美国:最顶尖的世界名牌眼镜, 能得到打折季的价格
2019/03/10 全球购物
个人现实表现材料
2014/02/04 职场文书
80后职场人的职业生涯规划
2014/03/08 职场文书
房屋出售协议书
2014/04/10 职场文书
文明寄语大全
2014/04/11 职场文书
户籍证明格式
2014/09/15 职场文书
绍兴鲁迅故居导游词
2015/02/09 职场文书
世界十大儿童漫画书排名,法国国宝漫画排第五,第二是轰动日本连环
2022/03/18 欧美动漫
浅谈音视频 pts dts基本概念及理解
2022/08/05 数码科技