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 相关文章推荐
火狐浏览器(firefox)下获得Event对象以及keyCode
Nov 13 Javascript
jquery 插件 任意位置浮动固定层
Dec 25 Javascript
jQuery插件-jRating评分插件源码分析及使用方法
Dec 28 Javascript
JS中的substring和substr函数的区别说明
May 07 Javascript
使用闭包对setTimeout进行简单封装避免出错
Jul 10 Javascript
Jquery+asp.net后台数据传到前台js进行解析的方法
May 11 Javascript
浅谈angularjs $http提交数据探索
Jan 20 Javascript
JS实现的简单图片切换功能示例【测试可用】
Feb 14 Javascript
js实现简易垂直滚动条
Feb 22 Javascript
vue2.0 移动端实现下拉刷新和上拉加载更多的示例
Apr 23 Javascript
IDEA配置jQuery, $符号不再显示黄色波浪线的问题
Oct 09 jQuery
vue+element ui实现锚点定位
Jun 29 Vue.js
使用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下关于Cannot use a scalar value as an array的解决办法
2010/08/08 PHP
用PHP生成excel文件到指定目录
2015/06/22 PHP
ZF框架实现发送邮件的方法
2015/12/03 PHP
类似CSDN图片切换效果脚本
2009/09/17 Javascript
JavaScript模块随意拖动示例代码
2014/05/27 Javascript
封装了一个支持匿名函数的Javascript事件监听器
2014/06/05 Javascript
首页图片漂浮效果示例代码
2014/06/05 Javascript
javascript动态判断html元素并执行不同的操作
2014/06/16 Javascript
javascript学习笔记(五)原型和原型链详解
2014/10/08 Javascript
AngularJS实现表单验证
2015/01/28 Javascript
jQuery实现页面点击后退弹出提示框的方法
2016/08/24 Javascript
jQuery实现移动端手机商城购物车功能
2016/09/24 Javascript
详解Angular的8个主要构造块
2017/06/20 Javascript
vue checkbox 全选 数据的绑定及获取和计算方法
2018/02/09 Javascript
详解nodejs通过响应回写的方式渲染页面资源
2018/04/07 NodeJs
解决Vue+Electron下Vuex的Dispatch没有效果问题
2019/05/20 Javascript
js实现简单掷骰子效果
2019/10/24 Javascript
微信小程序自定义弹出层效果
2020/05/26 Javascript
JavaScript实现复选框全选和取消全选
2020/11/20 Javascript
[53:50]CHAOS vs Mineski 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
利用Python将每日一句定时推送至微信的实现方法
2018/08/13 Python
解决python "No module named pip" 的问题
2018/10/13 Python
Python中按键来获取指定的值
2019/03/02 Python
10招!看骨灰级Pythoner玩转Python的方法
2019/04/15 Python
python导入pandas具体步骤方法
2019/06/23 Python
Python利用matplotlib做图中图及次坐标轴的实例
2019/07/08 Python
详解python调用cmd命令三种方法
2019/07/08 Python
Pandas时间序列:重采样及频率转换方式
2019/12/26 Python
PyTorch实现更新部分网络,其他不更新
2019/12/31 Python
如何基于python实现归一化处理
2020/01/20 Python
python3代码输出嵌套式对象实例详解
2020/12/03 Python
python飞机大战游戏实例讲解
2020/12/04 Python
世界领先的电子书网站:eBooks.com(在线购买小说、非小说和教科书)
2019/03/30 全球购物
2015年信息宣传工作总结
2015/05/26 职场文书
2015年秋季开学典礼校长致辞
2015/07/16 职场文书
pytorch 使用半精度模型部署的操作
2021/05/24 Python