123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147 |
- /*
- * ContextMenu - jQuery plugin for right-click context menus
- *
- * Author: Chris Domigan
- * Contributors: Dan G. Switzer, II
- * Parts of this plugin are inspired by Joern Zaefferer's Tooltip plugin
- *
- * Dual licensed under the MIT and GPL licenses:
- * http://www.opensource.org/licenses/mit-license.php
- * http://www.gnu.org/licenses/gpl.html
- *
- * Version: r2
- * Date: 16 July 2007
- *
- * For documentation visit http://www.trendskitchens.co.nz/jquery/contextmenu/
- *
- */
- (function($) {
- var menu, shadow, content, hash, currentTarget;
- var defaults = {
- menuStyle: {
- listStyle: 'none',
- padding: '1px',
- margin: '0px',
- backgroundColor: '#fff',
- border: '1px solid #999',
- width: '100px'
- },
- itemStyle: {
- margin: '0px',
- color: '#000',
- display: 'block',
- cursor: 'default',
- padding: '3px',
- border: '1px solid #fff',
- backgroundColor: 'transparent'
- },
- itemHoverStyle: {
- border: '1px solid #0a246a',
- backgroundColor: '#b6bdd2'
- },
- eventPosX: 'pageX',
- eventPosY: 'pageY',
- shadow : true,
- onContextMenu: null,
- onShowMenu: null
- };
- $.fn.contextMenu = function(id, options) {
- if (!menu) { // Create singleton menu
- menu = $('<div id="jqContextMenu"></div>')
- .hide()
- .css({position:'absolute', zIndex:'500'})
- .appendTo('body')
- .bind('click', function(e) {
- e.stopPropagation();
- });
- }
- if (!shadow) {
- shadow = $('<div></div>')
- .css({backgroundColor:'#000',position:'absolute',opacity:0.2,zIndex:499})
- .appendTo('body')
- .hide();
- }
- hash = hash || [];
- hash.push({
- id : id,
- menuStyle: $.extend({}, defaults.menuStyle, options.menuStyle || {}),
- itemStyle: $.extend({}, defaults.itemStyle, options.itemStyle || {}),
- itemHoverStyle: $.extend({}, defaults.itemHoverStyle, options.itemHoverStyle || {}),
- bindings: options.bindings || {},
- shadow: options.shadow || options.shadow === false ? options.shadow : defaults.shadow,
- onContextMenu: options.onContextMenu || defaults.onContextMenu,
- onShowMenu: options.onShowMenu || defaults.onShowMenu,
- eventPosX: options.eventPosX || defaults.eventPosX,
- eventPosY: options.eventPosY || defaults.eventPosY
- });
- var index = hash.length - 1;
- $(this).bind('contextmenu', function(e) {
- // Check if onContextMenu() defined
- var bShowContext = (!!hash[index].onContextMenu) ? hash[index].onContextMenu(e) : true;
- currentTarget = e.target;
- if (bShowContext) {
- display(index, this, e );
- return false;
- }
- });
- return this;
- };
- function display(index, trigger, e ) {
- var cur = hash[index];
- content = $('#'+cur.id).find('ul:first').clone(true);
- content.css(cur.menuStyle).find('li').css(cur.itemStyle).hover(
- function() {
- $(this).css(cur.itemHoverStyle);
- },
- function(){
- $(this).css(cur.itemStyle);
- }
- ).find('img').css({verticalAlign:'middle',paddingRight:'2px'});
- // Send the content to the menu
- menu.html(content);
- // if there's an onShowMenu, run it now -- must run after content has been added
- // if you try to alter the content variable before the menu.html(), IE6 has issues
- // updating the content
- if (!!cur.onShowMenu) menu = cur.onShowMenu(e, menu);
- $.each(cur.bindings, function(id, func) {
- $('#'+id, menu).bind('click', function() {
- hide();
- func(trigger, currentTarget);
- });
- });
- menu.css({'left':e[cur.eventPosX],'top':e[cur.eventPosY]}).show();
- if (cur.shadow) shadow.css({width:menu.width(),height:menu.height(),left:e.pageX+2,top:e.pageY+2}).show();
- $(document).one('click', hide);
- }
- function hide() {
- menu.hide();
- shadow.hide();
- }
- // Apply defaults
- $.contextMenu = {
- defaults : function(userDefaults) {
- $.each(userDefaults, function(i, val) {
- if (typeof val == 'object' && defaults[i]) {
- $.extend(defaults[i], val);
- }
- else defaults[i] = val;
- });
- }
- };
- })(jQuery);
- $(function() {
- $('div.contextMenu').hide();
- });
|