I’m a total beginner with jQuery and I am having a lot of trouble with a responsive website I’m designing. Their are 2 horizontal menus on the desktop site, when the screen size hits 657px and less I need the horizontal menus to become drop down menus.
I thought I had everything working until I realised that when the screen size was less than 657px and I opened and closed(toggled?) the drop down it would open and close in the larger sizes as well, which makes perfect sense but I have no idea how to stop it doing that, so basically what I need is that the drop-down that appears at sizes 657px and less toggles only, not the horizontal menus as well.
http://jsfiddle.net/4J3qU/ : my jQuery, html and css (ps i know i’ve misused the id’s and classes in my html, i was experimenting with an idea).
Thank you for your help, i hope someone can solve this.