Convert Menu to Dropdown: Prefix for sub-categories

[tammelin]

Hi guys … I am just getting started with jQuery and I need some guidance here…

I want to take the jQuery script found here https://css-tricks.com/convert-menu-to-dropdown/ and apply it for one of my ecommerce sites.

But I need a slight modification … I need the sub-categories (and 2nd level sub-categories and so on) to have a prefix (–) for the menu to be more readable.

I have managed to get it to work with 1st level sub-categories using this code:
var prefix = (el.parent().hasClass(‘level1’) == true) ? “- ” : “”;

Now I don’t know how to get to work for even deeper categories.

I have uploaded the modification to codepen to make it easier for you guys to get the whole concept. You can find it here: [http://codepen.io/anon/pen/rlfhq](http://codepen.io/anon/pen/rlfhq “http://codepen.io/anon/pen/rlfhq”)

Your help is much appreciated! Thank you!

[tammelin]

Update:

I just managed to solve this myself after a while of testnig.

If anyone is interested, the result looks like this: http://codepen.io/anon/pen/JbACk

Might come in handy for other people that want to add more mobile-friendly navigation for their ecommerce sites with big catalogues.

[Author]

Posts