特效描述:页面鼠标点击 右键弹出菜单。
代码结构
1. 引入JS
2. HTML代码
var kyoPopupMenu={};
kyoPopupMenu = (function(){
return {
sys: function (obj) {
$('.popup_menu').remove();
popupMenuApp = $('
').find('a').attr('href','javascript:;')
.end().appendTo('body');
//绑定事件
$('.app-menu a[menu="menu1"]').on('click', function (){
window.location.href="http://www.17sucai.com";
});
$('.app-menu a[menu="menu2"]').on('click', function (){
window.location.href="http://www.baidu.com";
});
$('.app-menu a[menu="menu3"]').on('click', function (){
window.location.href="http://www.sina.com.cn";
});
return popupMenuApp;
}
}})();
//取消右键
$('html').on('contextmenu', function (){return false;}).click(function(){
$('.popup_menu').hide();
});
//桌面点击右击
$('html').on('contextmenu',function (e){
var popupmenu = kyoPopupMenu.sys();
l = ($(document).width() - e.clientX) < popupmenu.width() ? (e.clientX - popupmenu.width()) : e.clientX;
t = ($(document).height() - e.clientY) < popupmenu.height() ? (e.clientY - popupmenu.height()) : e.clientY;
popupmenu.css({left: l,top: t}).show();
return false;
});