CSS 2 Layer Drop Down Menu-Help

[WindberTSA]

Hey guys. I am trying to create a two level drop down navigation menu. I wanted it to appear similar to this, [http://jsfiddle.net/jblasco/XAE9c/](http://jsfiddle.net/jblasco/XAE9c/ “”) , but I was trying to make it on my own. The code below is what I have right now, but I am stuck and I was wondering if someone could help me figure out why it doesn’t work.

Thanks!!

• Tech Ed Dept.

• History
• Teachers
• Class Offerings
• Mission Statement

[ToxicFire]

Aiming for something like this? http://codepen.io/anon/pen/qGzgA

[Paulie_D]

@ToxicFire.

Your Pen seems to have two navs with the same ID (which is a no-no) but I understand you have just copied the OP’s code.

http://codepen.io/Paulie-D/pen/pAIdB

I’m not sure what that JS is trying to achieve that can’t be done with CSS.

[WindberTSA]

First off, Thanks for the help!

@ToxicFire

That’s exactly what I am aiming for. Is there a way to make the drop down portion remain active only while navigating through pages inside that section?

@Paulie_D

It did have two navs and that is when I started to realize that I was having a problem.. I am very new at this.

And I am not good with JS. I was trying to learn how to use it a bit and had been following a tutorial.. I do not quite understand the JS yet.

What is the JavaScript in your CodePen doing for that menu bar?

[ToxicFire]

Js basically is just duplicating the css :hover so is redundant.

As for keeping the menu dropped down the code to do that is already in there
you just need to give the section li a class of over on that sections page

• blog
• blah

  • Sub-Blah1
  • Sub-Blah2
  • Sub-Blah3

[WindberTSA]

Thanks for all your help!

[Author]

Posts