Top level links on canvas menus not working properly in touch screens

The problem was that canvas menus on touch devices like phones had the top level link with sub-menu only opening the sub-menu instead of also opening the top-level link.

This post is a followup to the closed thread found at:

In that thread @christopher.amirian gave a temporary solution with this JS:

jQuery ( function($) {

$('.x-menu-collapsed .menu-item-has-children > .x-anchor').on('mousdown touchend', function(e) {
if ( (!$(e.srcElement).is('.x-anchor-sub-indicator')) && (!$(e.srcElement).is('.x-anchor-content')) ) {
  var $this = $(this);
  $this.siblings('ul').hide();
  window.location = $(this).attr('href');
} }); });

the problem with this code is that in some instances we need the top-level menu to have no link at all and be instead only a top level menu.

With the code above, those kinds of placeholder-menus generate instead a link to “undefined” causing a 404 error.
Any jQuery guru would be kind enough to change the code to account for instances where the link is actually empty or just “#”?

Thanks in advance.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.