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 相关文章推荐
Javascript对象中关于setTimeout和setInterval的this介绍
Jul 21 Javascript
Ajax异步提交表单数据的说明及方法实例
Jun 22 Javascript
jQuery实现两款有动画功能的导航菜单代码
Sep 16 Javascript
JavaScript数组的栈方法与队列方法详解
May 26 Javascript
封装获取dom元素的简单实例
Jul 08 Javascript
js倒计时简单实现代码
Aug 11 Javascript
微信小程序 vidao实现视频播放和弹幕的功能
Nov 02 Javascript
bootstrap组件之按钮式下拉菜单小结
Jan 19 Javascript
ReactJs实现树形结构的数据显示的组件的示例
Aug 18 Javascript
layer.close()关闭进度条和Iframe窗的方法
Aug 17 Javascript
ES6 Object方法扩展的应用实例分析
Jun 25 Javascript
JS实现滑动拼图验证功能完整示例
Mar 29 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
建站常用13种PHP开源CMS比较
2009/08/23 PHP
DW中链接mysql数据库时,建立字符集中文出现乱码的解决方法
2010/03/27 PHP
PHP取进制余数函数代码
2012/01/19 PHP
jQuery EasyUI API 中文文档 - Tabs标签页/选项卡
2011/10/01 Javascript
用jquery实现点击栏目背景色改变
2012/12/10 Javascript
Javascript字符串对象的常用方法简明版
2014/06/26 Javascript
JavaScript自定义等待wait函数实例分析
2015/03/23 Javascript
深入浅析javascript立即执行函数
2015/10/23 Javascript
canvas绘制万花筒效果(代码分享)
2017/01/20 Javascript
原生js编写2048小游戏
2017/03/17 Javascript
详解vuex 中的 state 在组件中如何监听
2017/05/23 Javascript
swiper 解决动态加载数据滑动失效的问题
2018/02/26 Javascript
利用vue.js把静态json绑定bootstrap的table方法
2018/08/28 Javascript
zepto.js 实时监听输入框的方法
2018/12/04 Javascript
nuxt踩坑之Vuex状态树的模块方式使用详解
2019/09/06 Javascript
JS如何实现动态添加的元素绑定事件
2019/11/12 Javascript
vue制作抓娃娃机的示例代码
2020/04/17 Javascript
JS this关键字在ajax中使用出现问题解决方案
2020/07/17 Javascript
Python检测一个对象是否为字符串类的方法
2015/05/21 Python
简单上手Python中装饰器的使用
2015/07/12 Python
Python中pygal绘制雷达图代码分享
2017/12/07 Python
django 按时间范围查询数据库实例代码
2018/02/11 Python
python3.6使用tkinter实现弹跳小球游戏
2019/05/09 Python
python+django+rest框架配置创建方法
2019/08/31 Python
详解WebSocket跨域问题解决
2018/08/06 HTML / CSS
乌克兰网上服装店:Bolf.ua
2018/10/30 全球购物
阿联酋手表和配饰购物网站:Rivolishop
2019/11/25 全球购物
武汉世纪畅想数字传播有限公司.NET笔试题
2014/07/22 面试题
试用期转正鉴定评语
2014/01/27 职场文书
军训自我鉴定100字
2014/02/13 职场文书
《望庐山瀑布》教学反思
2014/04/22 职场文书
高中班级口号
2014/06/09 职场文书
2014年绩效考核工作总结
2014/12/11 职场文书
审美与表现自我评价
2015/03/09 职场文书
赵氏孤儿观后感
2015/06/09 职场文书
叶问观后感
2015/06/15 职场文书