Tiny jQuery Plugin For Chrome Style Context Menus - chromeContext

File Size: 9.09KB
Views Total: 1312
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Tiny jQuery Plugin For Chrome Style Context Menus - chromeContext

Chrome Context is a lightweight (~1kb minified) jQuery plugin for creating google chrome browser style context menus when right clicking html elements.

You might also like:

How to use it:

1. Include required jQuery Chrome Context stylesheet in the head section of your page

<link rel="stylesheet" href="css/chromeContext.css">

2. Create the html

<div id="demo">Demo</div>

3. Include the latest jQuery library and jQuery Chrome Context plugin at the bottom of your web page

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="js/jquery.chromeContext.js"></script> 

4. Create your menus in the javascript

$(function(){
$('#demo').chromeContext({
items: [
{ title: 'Item 1',
onclick: function () { window.location = 'https://www.jqueryscript.net'; } },
{ title: 'Item 2',
onclick: function () { console.log('two.'); } },
{ title: 'Item 3',
onclick: function () { console.log('three.'); } },
{ title: 'Item 4',
onclick: function () { console.log('four.'); } },
{ title: 'Item 5',
onclick: function () { console.log('five.'); } },
{ title: 'Item 6',
onclick: function () { console.log('six.'); }
}
]
});
});

Change log:

v0.0.2 (2013-09-14)

  • Fixed min-width on menu

This awesome jQuery plugin is developed by travishorn. For more Advanced Usages, please check the demo page or visit the official website.