I had to go googling again to find a way to match the navigation of this blog site to my my original site mockup. I found some tutorials online by AwfulMedia to help me build it using css and jQuery toggling. The first tutorial explains the dropdown and the second talks you through the toggle effect. You will see I have a file called myscript.js in this site to make the toggling happen.

Responsive WordPress Theme Tutorial – Part 5 – Dropdown Navigation Menu

Responsive WordPress Theme Tutorial – Part 6 – jQuery Toggle Menu

This works and I was able to tweak it in order to customise it to my needs. There may be plugins also available to make this work, however I was weary that plugins might weigh down the site more than a bit of css and a short bit of jquery.

From:

My Dropdown