WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm creating a Wordpress site with a Superfish CSS3 / Jquery dropdown menu, complete with hoverIntent as displayed here:


As far as I can see, this menu works well on mobile devices, because the link values refer to the same page, like #a, so that clicking a link does not cause the page to reload.

Please bear with me. I know that the right way would be to replace the dropdown menu entirely (with a select box or some other tool), but I need to have the exact same experience as on a desktop (long story).

My question is: how can I replace the href value of parent pages, with an internal link like #a?

My guess would be that doing this via jQuery would be the best solution. What are your views on this and could someone please provide a practical answer? Thanks in advance.

share|improve this question

closed as off topic by kaiser, Wyck, Brian Fegter, Rarst Oct 2 '12 at 21:07

Questions on WordPress Development Stack Exchange are expected to relate to WordPress within the scope defined by the community. Consider editing the question or leaving comments for improvement if you believe the question can be reworded to fit within the scope. Read more about reopening questions here.If this question can be reworded to fit the rules in the help center, please edit the question.

off topic - should be moved to SO. – kaiser Sep 11 '12 at 14:01
I understand this could be seen as a non-Wordpress question, but your answer proves my questions' validity here, no? :-) – maartenmachiels Sep 11 '12 at 18:42
No, it doesn't :) I've just proven, that your problem with Suckerfishe is a plain js problem. I also showed you, that you have alternatives, that avoid having this problem (as well as having Suckerfish). As I'm one of the higher rep users here, I just try to show others how cosy our place is and that you can help each other in a friendly way :) – kaiser Sep 12 '12 at 1:03
Alright, kaiser, you have a point! I'll keep it in mind. Thanks for your friendly suggestion. – maartenmachiels Sep 12 '12 at 8:34
up vote 1 down vote accepted

In my experience, Superfish actually does not rely on in-page links in order to show the submenus on touch devices (although admittedly I'm basing this solely on iOS devices).

Simply tap once on a top-level menu item and its submenu should show. A subsequent tap on the same top-level menu item would cause the browser to load that link.

share|improve this answer
Thanks, joel. I'll be testing it out on Android devices to confirm this! – maartenmachiels Sep 12 '12 at 10:04

You could do multiple things to get this working:

jQuery( '.your-nav-menu-item-class' ).on( 'click', function( e )

    // replace the link here

    return false;

You could also just use a walker class.

Or one of the filters inside wp_nav_menu() - just check the source.

  • Before the Walker: apply_filters( 'wp_nav_menu_objects', $sorted_menu_items, $args )
  • After the Walker: apply_filters( 'wp_nav_menu_items', $items, $args )
  • Same, but more specific: apply_filters( "wp_nav_menu_{$menu->slug}_items", $items, $args )
  • The resulting HTML: apply_filters( 'wp_nav_menu', $nav_menu, $args )
share|improve this answer
Thank you for your answer. It gives a clear view of the functions of the wp_nav_menu. Thank you for providing an alternative aswell. Very useful! – maartenmachiels Sep 11 '12 at 18:43

Not the answer you're looking for? Browse other questions tagged or ask your own question.