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 相关文章推荐
jQuery 联动日历实现代码
May 31 Javascript
js绑定事件this指向发生改变的问题解决方法
Apr 23 Javascript
jquery的ajax和getJson跨域获取json数据的实现方法
Feb 04 Javascript
js中confirm实现执行操作前弹出确认框的方法
Nov 01 Javascript
jquery手风琴特效插件
Feb 04 Javascript
JS获取表格内指定单元格html内容的方法
Mar 31 Javascript
JavaScript实现随机替换图片的方法
Apr 16 Javascript
基于jquery实现一个滚动的分步注册向导-附源码
Aug 26 Javascript
JavaScript中Array方法你该知道的正确打开方法
Sep 11 Javascript
Vuepress 搭建带评论功能的静态博客的实现
Feb 17 Javascript
一文了解vue-router之hash模式和history模式
May 31 Javascript
利用js实现简易红绿灯
Oct 15 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
用PHPdig打造属于你自己的Google[图文教程]
2007/02/14 PHP
PHP函数shuffle()取数组若干个随机元素的方法分析
2016/04/02 PHP
javascript四舍五入函数代码分享(保留后几位)
2013/12/10 Javascript
js怎么判断flash swf文件是否加载完毕
2014/08/14 Javascript
NodeJs中的VM模块详解
2015/05/06 NodeJs
javascript元素动态创建实现方法
2015/05/13 Javascript
jQuery 跨域访问解决原理案例详解
2016/07/09 Javascript
Highcharts学习之数据列
2016/08/03 Javascript
Bootstrap实现input控件失去焦点时验证
2016/08/04 Javascript
js实现文字无缝向上滚动
2017/02/16 Javascript
javascript过滤数组重复元素的实现方法
2017/05/03 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
2017/06/17 Javascript
简单了解JavaScript sort方法
2019/11/25 Javascript
JavaScript 生成唯一ID的几种方式
2021/02/19 Javascript
Python enumerate遍历数组示例应用
2008/09/06 Python
Python模拟登陆淘宝并统计淘宝消费情况的代码实例分享
2016/07/04 Python
举例讲解Python编程中对线程锁的使用
2016/07/12 Python
Python 自动化表单提交实例代码
2017/06/08 Python
python dataframe 输出结果整行显示的方法
2018/06/14 Python
判断python字典中key是否存在的两种方法
2018/08/10 Python
python3.4爬虫demo
2019/01/22 Python
Python企业编码生成系统之主程序模块设计详解
2019/07/26 Python
Python学习笔记之错误和异常及访问错误消息详解
2019/08/08 Python
Python类和实例的属性机制原理详解
2020/03/21 Python
Python虚拟环境virtualenv创建及使用过程图解
2020/12/08 Python
python复合条件下的字典排序
2020/12/18 Python
为什么要使用servlet
2016/01/17 面试题
2014学习全国两会精神心得体会2000字
2014/03/11 职场文书
高中语文课后反思
2014/04/27 职场文书
好听的队名和口号
2014/06/09 职场文书
春节超市活动方案
2014/08/14 职场文书
忠诚教育心得体会
2014/09/03 职场文书
2015年读书月活动总结
2015/03/26 职场文书
办公室主任岗位竞聘书
2015/09/15 职场文书
个人房屋租赁合同(标准范本)
2019/09/16 职场文书
一小时学会TensorFlow2之基本操作2实例代码
2021/09/04 Python