Member Avatar for nish1234

Friends,

I need help with a vertical CSS menu. I am interested in a menu that can be found at http://www.cooper.com. It's a vertical menu with sub/sub elements. For example, click on 'Training' and see...

Is that a pure CSS menu? Or any JS involved?
Is it a dropdown menu or called something else? I don't think its dropdown.
Can anyone point me to some tutorials or help with code for a similar menu mentioned above?

Thanks in advance.
Nish

Edited by nish1234 because: n/a
  • 2 Contributors
  • 2 Replies
  • 213 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by laura_ci

Recommended Answers

All 2 Replies

Member Avatar for laura_ci

Hi Nish,

I'm afraid this menu isn't anything as exciting as a CSS drop-down menu or JavaScript. If you notice when you click on 'Training' that the page content also changes, as will as the sub-menu which appears below 'Training'.

This simply uses a different menu layout for each page with a sub-menu. So for example, if your on the home page the menu section "could" be:

<div id="menu">
  <h1>SERVICES</h1>
  <ul class="level_one">
    <li><a hef="evaluation.html">Evaluation</a></li>
    <li><a hef="training.html">Training</a></li>
    <li><a hef="org_consulting.html">Organizational Consulting</a></li>
  </ul>
</div>

Then when your on the Training page, the code is something like:

<div id="menu">
  <h1>SERVICES</h1>
  <ul class="level_one">
    <li><a hef="evaluation.html">Evaluation</a></li>
    <li>
      <a hef="training.html">Training</a>
      <ul class="level_two">
        <li><a hef="idp.html">Interaction Design Practicum</a></li>
        <li><a hef="comm_design.html">Communicating Design</a></li>
      </ul>
    </li>
    <li><a hef="org_consulting.html">Organizational Consulting</a></li>
  </ul>
</div>

But...

If your interesting in CSS Menus, check out the appropriately named CSS Menus site. You can download the files for free and tweak them where required. And most importantly, they work across ALL versions of IE, Firefox, Safari and Chrome.

Hope this helps

Edited by laura_ci because: n/a
Member Avatar for laura_ci

P.S. Welcome to Daniweb =D

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.