Complex menu example. Seaking advice from the experts...

Poster: HCBen
Dated: Friday August 4 2006 - 18:13:22 BST

I'm trying to use the Milonic menu to create a combined tab/drop-down navigation system.

Functionally, I've got it working, however there are several things about the menu that still don't work the way I want and I'm stumped as to what to do to get it working perfectly.

The idea behind the menu is that the first two levels of the navigation are tab based and clickable (kinda like the Amazon.com example), but once you mouse over the second level tabs you get the third level menu items as drop-downs.

I took two different approaches to try and accomplish this:

The first was that everthing was in one menu data file and I depended upon the openmenubyurl bolt on module to acheive the affect I wanted for the second level (tab) menu. However, the module depends upon the "showmenu" item property and I didn't know how to make the show menu work exclusively "on-click" while at the same time loading the target page. Plus, I didn't want the other tabs to show their menu items when I moused over them.

I couldn't readily find a solution searching the user forums, so I tried method two:

The other way was to simply create the parent/top tab menu in one data file and all the child tab menus in individual data files. For the most part, this seems to work best functionally, but there are still some issues I need help with and visually it doesn't work the way I want.

Here it is: http://wwwdev.hanover.edu/test/new/

Programmatically, is there a better/easier way to do this? Does anyone have any suggestions?

Visually, how can I get the parent tab to maintain it's appearance of being open when I click on a sub-tabs link. For example, click on the "Admission " tab then click on the "Apply Online" tab. Note how I loose the effect of the Admission tab appearing open.

I'm using the offclass style property to set the bottom border for each of the tab items, but then use the pageclass style property to set the border to zero when you're viewing that tab's page. The part I can't seem to figure out is how to accomplish this same affect when I view the page for a child tab/menu item.

I'm sooo close. Any advice/suggestions would be appreciated.

Thanks,
Ben

Poster: Ruth
Dated: Monday August 7 2006 - 10:00:10 BST

Hi,

Well, I can only think you'd need a function of some kind. What's happening is that when you click the admissions you go to the admissions page and open up the submenu, so the Admissions item remains highlighted because you are on that page. But when you click on Apply on line, you go to that apply page, since you are no longer at Admissions, then the highlighting goes away.

There is a possiblity of doing pagematch and set it to a folder, this would mean that if you had all the page for that submenu in the 'admissions' folder where the admissions page was, you could match the folder, so when you clicked on Apply if that page is in the admissions folder then the highlighting would remain. It would also be highlighted if you had a link on the admissions page to apply on line page and clicked the link instead of the menu, the menu would still be highlighted. The only problem with this is, if you had all the pages from that submenu in the folder, then they'd all match unless you made subfolders. So, you could have admissions/apply and set the match to be pagematch=admissions/apply/ then any page you went to in that apply folder would keep the admissions highlighted. The same would be true of any of the submenu items, if you put them in a subfolder for admissions and put in the pagematch in the items.

Here's an example offsite that is set that way. http://www.citytech.cuny.edu/index.shtml

Click on About Us. You'll see the highlighting, then click on News & Events in the submenu and when you get to the page go to the right and click on some link there. You'll see that when you get to that page the highlighting is still there.

They also have a text breadcrumb. You can do this with a function created here in the forum for the menu.

Breadcrumb demos:

1. Item highlighting when the menu is calling pages into an iframe
http://support.milonic.com/demos/breadcrumb/index.htm

2. Text breadcrumb: [passing item references] http://support.milonic.com/demos/pass_i ... /index.htm

There is also a function that was created for someone who wanted a different [3rd] image when some item was moused over in a submenu so the main menu mouse over image would change. I realize you don't have images, but since I don't know functions, I didn't know if maybe there was something here that you could 'manipulate'.

Set Parent Overimage Demo: http://support.milonic.com/demos/set_pa ... /index.htm

And here is the main demo page, maybe something else there will help you.

http://support.milonic.com/demos/


I don't know if any of these will help, but they might give you some ideas. Sorry, I'm not knowledgeable on functions, and I think you might need something like that, some function to tell it to pagematch if x, y, or z takes place.

Ruth

Poster: HCBen
Dated: Monday August 7 2006 - 10:58:07 BST

Ruth,

Pagematch was it! I did what you suggested using pagematch to match the directories, and so far everthing works perfectly. The solution was so simple and here I am making it harder than it actually is (as usual ).

Thank you so much for your feedback and additional suggestions. You are an invaluable member of this forum and I appreciate your help.

Ben

Poster: Ruth
Dated: Monday August 7 2006 - 11:15:29 BST

Hi,

Thanks

You're very welcome. I really like this menu and enjoy helping if I can.

Ruth

Code Request

Poster: ldeeder
Dated: Tuesday August 8 2006 - 21:46:46 BST

Would it be possible for you to send me the code you used to create this site? I have been having problems with the menu using iFrames and think your solution would work great for me. If not, I understand, and thank you.

Larry

Poster: Ruth
Dated: Wednesday August 9 2006 - 5:42:40 BST

Hi Larry,

If you could give us a page or link so we can see what you're trying to do, we could probably help you. There ususally isn't a problem with iframes, except with Opera [the older versions, I don't know if they fixed it in the newer ones]

If we had some idea what you were trying to set up as layout it would help.

Ruth

Setting up tabs with dropdowns

Poster: ldeeder
Dated: Wednesday August 9 2006 - 14:54:13 BST

Hi Ruth,

I am trying to do exactly what HCBen did here:

http://wwwdev.hanover.edu/test/new

I have got a little bit of it working, but having big problems with the sub tabs and sub vertical menues.

http://new2.regionalitsolutions.com

I liked his layout and approach as it loads very quick.

TIA Larry