扫一扫分享
Amazon网站分类导航的下拉菜单被使用得非常频繁,但你有没有注意过它的反应非常迅速?
menu-aim 是一个 jquery 下拉菜单插件,该插件能够甄别用户是尝试移动鼠标到下拉列表项还是将鼠标移至子菜单内容上。
$("#menu").menuAim({
activate: $.noop, // fired on row activation
deactivate: $.noop // fired on row deactivation
});
以下选项可以传递给menuAim。所有函数都使用相关行的html元素作为执行上下文('this')执行:
.menuAim({
// Function to call when a row is purposefully activated. Use this
// to show a submenu's content for the activated row.
activate: function() {},
// Function to call when a row is deactivated.
deactivate: function() {},
// Function to call when mouse enters a menu row. Entering a row
// does not mean the row has been activated, as the user may be
// mousing over to a submenu.
enter: function() {},
// Function to call when mouse exits a menu row.
exit: function() {},
// Function to call when mouse exits the entire menu. If this returns
// true, the current row's deactivation event and callback function
// will be fired. Otherwise, if this isn't supplied or it returns
// false, the currently activated row will stay activated when the
// mouse leaves the menu entirely.
exitMenu: function() {},
// Selector for identifying which elements in the menu are rows
// that can trigger the above events. Defaults to "> li".
rowSelector: "> li",
// You may have some menu rows that aren't submenus and therefore
// shouldn't ever need to "activate." If so, filter submenu rows w/
// this selector. Defaults to "*" (all elements).
submenuSelector: "*",
// Direction the submenu opens relative to the main menu. This
// controls which direction is "forgiving" as the user moves their
// cursor from the main menu into the submenu. Can be one of "right",
// "left", "above", or "below". Defaults to "right".
submenuDirection: "right"
});
menu-aim假设您使用的子菜单扩展到菜单右侧。当用户的鼠标进入新的下拉项目以及有意悬停该项目时,它将触发事件
手机预览