jquery 簡(jiǎn)短右鍵菜單 多瀏覽器兼容
$(function(){
document.oncontextmenu=function(){return false;}//屏蔽右鍵
document.onmousemove=mouseMove;//記錄鼠標(biāo)位置
});
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(){
/*這段 判斷鼠標(biāo)移到頁(yè)面的最右側(cè)或者最下側(cè) 防止出現(xiàn)滾動(dòng)條 {*/
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;}//超 寬
/*} 當(dāng)然也可以直接跳過(guò)*/
$("#"+id).hide().css({top:my,left:mx}).show();
}
});
}
});
在線(xiàn)演示 右鍵點(diǎn)擊測(cè)試效果
打包下載
- jquery事件機(jī)制擴(kuò)展插件 jquery鼠標(biāo)右鍵事件
- JQuery右鍵菜單插件ContextMenu使用指南
- jQuery簡(jiǎn)單實(shí)現(xiàn)禁用右鍵菜單
- jQuery右鍵菜單contextMenu使用實(shí)例
- 深入探討JavaScript、JQuery屏蔽網(wǎng)頁(yè)鼠標(biāo)右鍵菜單及禁止選擇復(fù)制
- 基于jQuery的動(dòng)態(tài)增刪改查表格信息,可左鍵/右鍵提示(原創(chuàng)自Zjmainstay)
- jquery實(shí)現(xiàn)在網(wǎng)頁(yè)指定區(qū)域顯示自定義右鍵菜單效果
- jquery禁用右鍵單擊功能屏蔽F5刷新
- jQuery檢測(cè)鼠標(biāo)左鍵和右鍵點(diǎn)擊的方法
- JQuery模擬實(shí)現(xiàn)網(wǎng)頁(yè)中自定義鼠標(biāo)右鍵菜單功能
相關(guān)文章
jQuery動(dòng)態(tài)生成的元素綁定事件操作實(shí)例分析
這篇文章主要介紹了jQuery動(dòng)態(tài)生成的元素綁定事件操作,結(jié)合實(shí)例形式分析了jQuery事件綁定的原理及動(dòng)態(tài)生成的元素綁定事件相關(guān)操作技巧,需要的朋友可以參考下2019-05-05關(guān)于jQuery新的事件綁定機(jī)制on()的使用技巧
本篇文章介紹了,關(guān)于jQuery新的事件綁定機(jī)制on()的使用技巧。需要的朋友參考下2013-04-04jQuery實(shí)現(xiàn)ajax的嵌套請(qǐng)求案例分析
這篇文章主要介紹了jQuery實(shí)現(xiàn)ajax的嵌套請(qǐng)求,結(jié)合具體實(shí)例形式分析了ajax嵌套請(qǐng)求的原理、實(shí)現(xiàn)方法及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2019-02-02JQuery DIV 動(dòng)態(tài)隱藏和顯示的方法
這篇文章主要介紹了JQuery DIV 動(dòng)態(tài)隱藏和顯示的方法的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06jQuery實(shí)現(xiàn)仿百度帖吧頭部固定導(dǎo)航效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)仿百度帖吧頭部固定導(dǎo)航效果,涉及jquery針對(duì)頁(yè)面高度計(jì)算與樣式的動(dòng)態(tài)添加及刪除技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-08-08jquery遍歷篩選數(shù)組的幾種方法和遍歷解析json對(duì)象
本文為大家介紹下jquery遍歷篩選數(shù)組的幾種方法和遍歷解析json對(duì)象的具體實(shí)現(xiàn),感興趣的朋友不要錯(cuò)過(guò)2013-12-12基于jquery的選擇標(biāo)簽至文本域效果,可多選/可過(guò)濾重復(fù)/可限制個(gè)數(shù)的實(shí)現(xiàn)代碼
選擇標(biāo)簽至表單域插件, 基于jQuery, 可多選/可過(guò)濾重復(fù)/可限制個(gè)數(shù). 是以前的項(xiàng)目中用到過(guò)的一個(gè)項(xiàng)目, 當(dāng)初是用原生js東拼西湊的, 用jQuery重寫(xiě)了下,已封裝成插件.2010-11-11jquery使用Cookie和JSON記錄用戶(hù)最近瀏覽歷史
本文就是要利用cookie插件,獲取用戶(hù)瀏覽文章歷史記錄,并將用戶(hù)最近瀏覽歷史記錄顯示在頁(yè)面,感興趣的小伙伴們可以參考一下2016-04-04JQuery 學(xué)習(xí)筆記 element屬性控制
JQuery元素屬性控制2009-07-07