本文给大家介绍一款非常强大并且非常简单容易上手的是jQuery右键菜单插件,jeegoocontext插件,下面看看该插件的使用及其配置参数

菜单可以通过以下两种方法初始化:

$('selector').jeegoocontext('menu_id');

$('selector').jeegoocontext('menu_id', 'options');

“selector”为菜单组建要绑定的内容,可以是任何jQuery选择器。
“menu_id”为菜单ID(没有 “#”)。
“options”为对象,可以配置属性和回调函数。

所有菜单内容都可以从菜单解绑,只需调用: 零度科技

$('context').nojeegoocontext();

Options properties:

 

 

 

 

 

livequery

Boolean

undefined

Menu

如为true, 菜单内容通过livequery生成并动态加载。

hoverClass

String

‘hover’

Menu

这个CSS类在鼠标悬停在菜单项或其直接子项时被设置。

activeClass

String

‘active’

Global

这个CSS类设置给当前活动的菜单 (右键点击会弹出菜单的区域)。 这个变量是全局的,在使用多个菜单时只需要设置一次。如果重复设置,其值为最后提供的。

menuClass

String

‘jeegoocontext’

Global

所有的菜单都必须包含这个CSS类。这个变量是全局的,在使用多个菜单时只需要设置一次。如果重复设置,其值为最后提供的。

autoAddSubmenuArrows

Boolean

true

Menu

如为true,则自动为有子项的菜单项添加指示箭头。

submenuClass

String

‘submenu’

Menu

如果autoAddSubmenuArrows为true, 这个类设置给菜单项中包含小箭头的<span>元素。

separatorClass

String

‘separator’

Menu

当某个菜单项含有此类,则在按键盘上下键切换菜单项时,该菜单项被跳过。

fadeIn

Number

200

Menu

菜单和子级菜单淡入的时间,单位为毫秒。

delay

Number

300

Menu

鼠标移出父菜单项时,其子菜单隐藏的延迟时间,单位为毫秒。

keyDelay

Number

100

Menu

上下键切换菜单项的延迟时间,单位为毫秒。

widthOverflowOffset

Number

0

Menu

可以在宽度溢出时使用。例如设置为20时,菜单和子菜单的右部总是离窗口右边界有20px的间距。

heightOverflowOffset

Number

0

Menu

可以在高度溢出时使用。例如设置为20时,菜单和子菜单的底部总是离窗口下边界有20px的间距。

submenuLeftOffset

Number

0

Menu

子菜单相对于父菜单的水平位移。如为-3,每个子菜单左部将有3px与父菜单重叠。

submenuTopOffset

Number

0

Menu

子菜单相对于父菜单的垂直位移。如为-3,每个子菜单将比其父菜单项高出3px。当然,在高度溢出的情况下,此值被忽略。

operaEvent

String

‘dblclick’

Menu

在Opera的9.5以前老版本中浏览器右键菜单时是禁止重写的,这个事件用来定义在Opera中如何打开菜单。

event

String

undefined

Menu

此项被设置时,定义的事件将用来取代右键打开菜单。优先于operaEvent属性。例如,设置为’click’将使用左键打开菜单。

Options callbacks

可设置以下4个回调: 内容来自www.00isp.com

onShowonHoveronSelectonHide 零度科技提供技术支持

每个回调接收两个参数:e 和 context,e为该事件的来源元素,context为菜单弹出所在的区域。利用这些回调函数,可以用return false的方法取消菜单事件的默认行为。 copyright www.00isp.com

 

 

 

 

onShow

menu

Right-click on bound context.

隐藏页面上所有菜单。在页面上删除所有处于active的菜单及菜单项的active类。为当前点击的内容添加active类。淡入菜单。

onHover

menu-item

Mouseover on menu-item.

定位并淡入子级菜单。

onSelect

menu-item

Click on menu-item.

删除当前处于active的菜单或菜单项的active类。隐藏菜单。

onHide

menu

Click on document.

在页面上删除所有处于active的菜单及菜单项的active类。隐藏菜单。