?
Solved

Expandable/Collapsable menus with multiple sub menus

Posted on 2011-02-14
6
Medium Priority
?
699 Views
Last Modified: 2012-08-13
Hello everyone.

I am just about to start to create a new site and i have come accross a problem before i even start.

I have been asked to add an expandable/collaspable menu system.  This is fine when it is only top layer adn sub layer, however, they want up to 3 sub layers (could go to 4.

So, roughtly how they want ti to work is.

Menu 1
    Menu 1.1
        Menu 1.1.1
   Menu 1.2
   Menu 1.3
      Menu 1.3.1
Menu 2
    Menu 2.1
        Menu 2.1.1
   Menu 2.2
   Menu 2.3
      Menu 2.3.1
Menu 3
    Menu 3.1
        Menu 3.1.1
   Menu 3.2
   Menu 3.3
      Menu 3.3.1

One catch, they want the other to go to the top menu once you start clicking on another menu. (Don't know if i have explained this correct?)

For example, if i click menu 1, if displays Menu1, Menu 1.1, Menu 1.2, Menu 2, Menu 3 etc.
If i click on Menu 1.1, it shows Menu 1, Menu 1.1 Menu 1.1.1 Menu 1.2, Menu 2, Menu 3 etc
But if i then click on Menu 2 it shows. Menu 1, Menu 2, Menu 2.1 Menu 2.2, Menu 3 etc.

The closest i have found is on http://examples.tobyinkster.co.uk/menu/menu2.strict but i can not get what i need to work when i change it.

I hope this explains everything in good enough details.

Any help would be greatly appreciated, spent the weekend trying to find this.

Thank you in advance.
Baker
0
Comment
Question by:Bakersville
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
6 Comments
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 34886922
0
 
LVL 1

Author Comment

by:Bakersville
ID: 34887113
Thank you for that.

I haver had a good look and can not see how i can add a sub menu to the menu.

Any chance you can help me with that.

Baker

0
 
LVL 5

Expert Comment

by:_-MYFOX-_
ID: 34887141
0
Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

 
LVL 1

Author Comment

by:Bakersville
ID: 34887657
Thank you MYFOX

Not what i needed.  I can make them come out to the side and do all other types of menu apart from one that is expanding and colapsing vertically.

Baker
0
 
LVL 5

Accepted Solution

by:
_-MYFOX-_ earned 2000 total points
ID: 34889646
In fact, I have reread most of your thorough explanation and now I understand .. what I found is more like this
http://www.java2s.com/Code/JavaScript/GUI-Components/FlyinMenuitem.htm

Or is this product that allows you to create almost any kind of menu javascript
http://www.likno.com/allwebmenusinfo.html

I hope will be helpful

My2Cent
0
 
LVL 1

Author Closing Comment

by:Bakersville
ID: 34894876
Thank you MyFox.

This is just what i was after. Perfect.
0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Did you know SD-WANs can improve network connectivity? Check out this webinar to learn how an SD-WAN simplified, one-click tool can help you migrate and manage data in the cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question