Is a possible to make second level menus appear only when hovering over the triangle pointing right

[igonzalez]

Thanks for such a great product!

Is a possible to make second level menus appear only when hovering over the triangle pointing right?

I found very distracting and busy showing second level menus automatically for long menus all with second levels!

I have been looking over the API and the source code but I have not been able to figure it out.

Any help will be appreciated

[admin]

Glad you like the script!

It’s not too difficult to achieve – e.g.:

var $mainMenu = $('#main-menu');
$mainMenu.bind('activate.smapi', function(e, item) {
		var obj = $mainMenu.data('smartmenus'),
			$item = $(item),
			$sub = $item.parent().dataSM('sub'),
			level = $sub ? $sub.dataSM('level') : -1;
		if (!obj.isTouchMode() && level > 2 && !$item.dataSM('arrow-activated')) {
			return false;
		}
		// unflag
		$item.removeDataSM('arrow-activated');
	})
	.delegate('span.sub-arrow', 'mouseenter', function(e) {
		var obj = $mainMenu.data('smartmenus'),
			$item = $(this).parent(),
			$sub = $item.parent().dataSM('sub'),
			level = $sub ? $sub.dataSM('level') : -1;
		if (!obj.isTouchMode() && level > 2) {
			// flag it so that we don't cancel the event on activate.smapi
			$item.dataSM('arrow-activated', true);
			$mainMenu.smartmenus('itemActivate', $item);
		}
	});

However, I am not sure it would be intuitive to use. I guess most users will simply click on the items if the sub menu doesn’t appear immediately on hover and will not think about hovering the sub indicator arrow instead.

[Author]

Posts