Start a new discussion

To start a new discussion please visit the discussions section of the GitHub home page of the project.

Discussions on GitHub

You can also search our old self-hosted forums for any useful information below but please note that posting new content here is not possible any more.

Re: Multiple instances of smartmenus that are separated on the page

Home › Forums › Older releases › 0.9.x › Multiple instances of smartmenus that are separated on the page › Re: Multiple instances of smartmenus that are separated on the page

February 25, 2014 at 06:02 #1569
admin
Keymaster

Hi,

You just need to add 2 menu list UL/LI/A structures in your source and set them different id’s – e.g.:

<ul id="main-menu-1" class="sm sm-blue">...
...
<ul id="main-menu-2" class="sm sm-blue">...

Then you can set their position as you like with some additional CSS – i.e. align the first to the left and the second to the right, etc.

Finally you will need to initialize both menus ondomready – e.g.:

$(function() {
	$('#main-menu-1').smartmenus({
		subMenusSubOffsetX: 1,
		subMenusSubOffsetY: -8
	});
	$('#main-menu-2').smartmenus({
		subMenusSubOffsetX: 1,
		subMenusSubOffsetY: -8,
		// you might want this option for the sub menus of the right menu
		rightToLeftSubMenus: true
	});
});

It’s actually just the same as having a single menu tree. You just need to configure 2 menus in this case.

Let me know if you have any questions.

Cheers!