Hi,

Dropdown submenus don't work on mobile devices. They open, but you can't click on the items.

Having spent a couple of hours trying to track this down, I've finally figured out what's happening:

In dropdown.js, when touch events are available they are bound to the mouse enter event:

.on('touchstart' + eventNamespace, selector.item, module.event.item.mouseenter)

Now, whenever there's a touch event, the handler is called. Note that this doesn't happen on a standard browser. Here's the handler:

mouseenter: function(event) {
  var
    $subMenu    = $(this).children(selector.menu),
    $otherMenus = $(this).siblings(selector.item).children(selector.menu)
  ;
  if( $subMenu.length > 0 ) {
    clearTimeout(module.itemTimer);
    module.itemTimer = setTimeout(function() {
      module.verbose('Showing sub-menu', $subMenu);
      $.each($otherMenus, function() {
        module.animate.hide(false, $(this));
      });
      module.animate.show(false,  $subMenu);
    }, settings.delay.show);
    event.preventDefault();
  }
},

When the users taps on an item in the submenu two things now happen:

1. The mouseenter is called for the .item. The code checks for another submenu and exits if there isn't one. So far so good...
2. The mouseenter is then called again, this time for the parent menu item (presumably the event is bubbling up the chain). This time the handler finds a submenu, calls the show submenu code (pointlessly, since it's already open), and then calls event.preventDefault().

Since event.preventDefault() is called, no further events are generated and the click event is hander is never called.

Commenting out the event.preventDefault() appears to solve the issue, but I don't know if there are other repercussion that need to be taken into account.