阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      插件 jQuery.Simple Context Menu 中文API文档

      插件 jQuery.Simple Context Menu 中文API文档 https://github.com/joewalnes/jquery-simple-context-menu A Simple Good Looking Context Menu, for jQuery

      Yes, there are loads of context menu plugins already. But they require a fair amount of work to make them look good.

      This one is easy to use, small, and looks good.

      Demo

      Features

      • Tiny library. Only dependency is jQuery.
      • Simple API.
      • Looks good out of the box, with no additional tweaking.
      • Designed to look and behave like a standard Windows context menu.
      • There’s so little code, it should be easy to add your own custom features.

      The menu looks like this:

      Screenshot

      Installation

      Include the files jquery.contextmenu.css and jquery.contextmenu.js in your page <head>. You also need jQuery. It is recommended that you use the HTML 5 DOCTYPE to ensure rendering consistency.

      <!DOCTYPE html>
      <html>
        <head>
           <script src="jquery-1.6.2.min.js"></script> 
           <script src="jquery.contextmenu.js"></script> 
           <link rel="stylesheet" href="jquery.contextmenu.css">
           ... rest of your stuff ...
      

      You can get the files from here:

      Usage

      The plugin introduces a contextPopup() method to the jQuery object.

      Assuming you have an element that you’d like to bind a context menu to:

      <div id="mythingy">hello</div>
      

      You can wire up a context menu like this:

      $('#mythingy').contextPopup({
        title: 'My Popup Menu',
        items: [
          {label:'Some Item',     icon:'icons/shopping-basket.png', action:function() { alert('clicked 1') } },
          {label:'Another Thing', icon:'icons/receipt-text.png',    action:function() { alert('clicked 2') } },
          null, /* null can be used to add a separator to the menu items */
          {label:'Blah Blah',     icon:'icons/book-open-list.png',  action:function() { alert('clicked 3') }, isEnabled:function() { return false; } },
        ]});
      

      The ‘isEnabled’ function is optional. By default all items are enabled.

      Icons

      The icons should be 16x16 pixels. I recommend the Fugue icon set (shadowless).

      kthxbye

      -joe

      Bitdeli Badge

      目录
      目录