js jQuery 右鍵選單 清屏
主要用到了oncontextmenu事件，在oncontextmenu事件中使用return false 遮蔽掉原生右鍵選單，再使用event獲取滑鼠的座標位置，設定自定義選單的位置。
http://swisnl.github.io/jQuery-contextMenu/demo.html
https://swisnl.github.io/jQuery-contextMenu/docs.html
http://www.hangge.com/blog/cache/detail_1821.html
| <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="jquery-3.1.1.js" charset="utf-8"></script> <script src="contextMenu/jquery.ui.position.min.js" type="text/javascript"></script> <script src="contextMenu/jquery.contextMenu.js" type="text/javascript"></script> <link href="contextMenu/jquery.contextMenu.css" rel="stylesheet" type="text/css" /> </head> <body> <button class="context-menu-one">按鈕1</button> <script type="text/javascript"> $(function() { //初始化選單 $.contextMenu({ selector: '.context-menu-one', callback: function(key, options) { console.log("點選了：" + key); }, items: { "edit": {name: "編輯", icon: "edit"}, "cut": {name: "剪下", icon: "cut"}, "copy": {name: "複製", icon: "copy"}, "paste": {name: "貼上", icon: "paste"}, "delete": {name: "刪除", icon: "delete"}, "sep1": "---------", "quit": {name: "退出", icon: function(){ return 'context-menu-icon context-menu-icon-quit'; }} } }); }); </script> </body> </html> |
icon: "paste" // Class context-menu-icon-paste is used on the menu item.
使用自帶的圖示需要font資料夾的內容
http://www.111cn.net/wy/jquery/141609.htm