ACTIONpack Posted February 5, 2014 Share Posted February 5, 2014 I'm not good at jQuery and would like to be able to click and the menu would drop down. I'm trying to do it but its not working. Here is my sample. Want to do it instead of hover so people can use it on menu. http://cssdeck.com/labs/0pgruqby Link to comment Share on other sites More sharing options...
0 Brian M. Veteran Posted February 5, 2014 Veteran Share Posted February 5, 2014 Here is a very simple (oversimplified) example of what you're trying to do: http://jsfiddle.net/yGp4f/ The whole thing can be done with no classes and one line of JS if needed. Link to comment Share on other sites More sharing options...
0 +Zlip792 MVC Posted February 5, 2014 MVC Share Posted February 5, 2014 If you try to extend it: http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm Link to comment Share on other sites More sharing options...
0 Brian M. Veteran Posted February 5, 2014 Veteran Share Posted February 5, 2014 Change: $(this).find('ul')to $(this).parent().find('ul')The ul isn't in the <a>, it's in the parent li. Also, you refer to a.dropdown, which doesn't exist - that means: a with the class dropdown. Link to comment Share on other sites More sharing options...
0 the better twin Posted February 5, 2014 Share Posted February 5, 2014 Lots of things wrong here. Your selector is wrong. Theres no a with a class of dropdown. Theres no such function as onclick either. Link to comment Share on other sites More sharing options...
0 ACTIONpack Posted February 5, 2014 Author Share Posted February 5, 2014 Yea, Trying to fix it now but no go. I made changes but not working. Link to comment Share on other sites More sharing options...
0 the better twin Posted February 5, 2014 Share Posted February 5, 2014 Yea, Trying to fix it now but no go. I made changes but not working. Pretty simple and you can use slideToggle to cut down on your repetition too. Just add a class to your first unordered list and then change your jQuery to the following(i would target the list item as opposed to the anchor tag which you dont need): $('ul.main li').click(function(){ $(this).find('ul').slideToggle(); }); Link to comment Share on other sites More sharing options...
0 ACTIONpack Posted February 5, 2014 Author Share Posted February 5, 2014 Try that and still no go. Pretty simple and you can use slideToggle to cut down on your repetition too. Just add a class to your first unordered list and then change your jQuery to the following(i would target the list item as opposed to the anchor tag which you dont need): $('ul.main li').click(function(){ $(this).find('ul').slideToggle(); }); Link to comment Share on other sites More sharing options...
0 ACTIONpack Posted February 5, 2014 Author Share Posted February 5, 2014 Thanks for your help! Link to comment Share on other sites More sharing options...
0 acido00 Posted February 5, 2014 Share Posted February 5, 2014 I suggest you go for a CSS dropdown menu: http://www.inmotionhosting.com/support/edu/website-design/using-css/simple-css-drop-down-menu I implemented that one and it worked in all mobile devices and desktop and even IE 7. Seahorsepip 1 Share Link to comment Share on other sites More sharing options...
Question
ACTIONpack
I'm not good at jQuery and would like to be able to click and the menu would drop down. I'm trying to do it but its not working. Here is my sample. Want to do it instead of hover so people can use it on menu.
http://cssdeck.com/labs/0pgruqby
Link to comment
Share on other sites
9 answers to this question
Recommended Posts