menu.htm 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title></title>
  5. <link href="../../lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
  6. <script src="../../lib/jquery/jquery-1.5.2.min.js" type="text/javascript"></script>
  7. <script src="../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
  8. <script src="../../lib/ligerUI/js/plugins/ligerMenu.js" type="text/javascript"></script>
  9. <script type="text/javascript">
  10. var menu;
  11. function onclick11(item, i)
  12. {
  13. alert(item.text);
  14. }
  15. function onclick112()
  16. {
  17. menu.hide();
  18. }
  19. $(function ()
  20. {
  21. menu = $.ligerMenu({ top: 100, left: 100, width: 120, items:
  22. [
  23. { text: '增加', click: onclick11,icon:'add' },
  24. { text: '修改', click: onclick11 },
  25. { line: true },
  26. { text: '查看', click: onclick11, children:
  27. [
  28. { text: '报表', click: onclick11 },
  29. { text: '导出', children: [{ text: 'Excel', click: onclick11 }, { text: 'Word'}]
  30. }
  31. ] },
  32. { text: '关闭', click: onclick112 }
  33. ]
  34. });
  35. $(document).bind("contextmenu", function (e)
  36. {
  37. menu.show({ top: e.pageY, left: e.pageX });
  38. return false;
  39. });
  40. });
  41. </script>
  42. <style type="text/css">
  43. #menu1,.l-menu-shadow{top:30px; left:50px;}
  44. #menu1{ width:200px;}
  45. </style>
  46. </head>
  47. <body style="padding:20px; overflow:hidden; ">
  48. <div id="div1" style="width:400px; height:400px;">
  49. </div>
  50. </body>
  51. </html>