Reply To: More option for desktop menu?

[admin]

OK, here is something that should work (even if you are using any SmartMenus addon). You need to include this on your page after the SmartMenus script “jquery.smartmenus.js”:

$.SmartMenus.prototype.old_init = $.SmartMenus.prototype.init;
$.SmartMenus.prototype.init = function(refresh) {
	if (!refresh && !this.$root.hasClass('sm-vertical')) {
		var $originalItems = this.$root.children('li'),
			$moreSub = this.$root.clone().removeAttr('id').removeAttr('class').addClass('dropdown-menu'),
			$moreSubItems = $moreSub.children('li'),
			$moreItem = $('<li><a href="#">More <span class="caret"></span></a></li>').append($moreSub).appendTo(this.$root),
			self = this,
			vieportW,
			hiddenItems = [],
			hiddenMoreItems = [];
	}

	this.old_init(refresh);

	if (!refresh && !this.$root.hasClass('sm-vertical')) {
		function handleResize() {
			var curWidth = $(window).width();
			if (vieportW !== curWidth) {
				// hide More item
				$moreItem.detach();

				// show all main menu items
				$.each(hiddenItems, function() { $(this).appendTo(self.$root); });
				hiddenItems = [];

				// show all More sub items
				$.each(hiddenMoreItems, function() { $(this).prependTo($moreSub); });
				hiddenMoreItems = [];

				// if in desktop view and the last item is wrapped
				if (!self.isCollapsible() && $originalItems.eq(-1)[0].offsetTop != $originalItems.eq(0)[0].offsetTop) {
					// show More item
					$moreItem.appendTo(self.$root);

					// while the More item is wrapped
					while ($moreItem[0].offsetTop != $originalItems.eq(0)[0].offsetTop) {
						hiddenItems.unshift($moreItem.prev('li').detach());
					};

					// hide proper More sub items
					$moreSubItems.slice(0, $moreSubItems.length - hiddenItems.length).each(function() {
						hiddenMoreItems.unshift($(this).detach());
					});
				}

				// save new viewport width
				vieportW = curWidth;
			}
		}
		handleResize();

		$(window).bind('load.smartmenus resize.smartmenus', handleResize);
	}
};

It doesn’t need any configuration and will work for any horizontal main menu.

I like the idea very much and in the future this might actually become an official addon after some possible code optimizations, etc. But it should work just fine for now as it is.

Please let me know if you have any questions.