jQuery 下拉列表仅在移动设备上生效

Question

目前，我已经设置了移动导航来创建下拉功能。您可以在此处看到一个工作示例（只需将浏览器拉小即可查看移动导航）：http://goo.gl/TzPPd

问题是jQuery下拉效果也应用于非移动导航，这导致了一些问题。我希望jQuery效果仅适用于移动导航，这是我当前使用的代码：

$(function() {
  $('ul.menu > li > a').click(function(e) {
    $('ul.sub-menu').slideUp('normal');
      if($(this).next('ul.sub-menu').is(':hidden') === true) {    
        $(this).next('ul.sub-menu').slideDown('normal');
      }
   e.preventDefault();
  });
}); 

我试过这个，但没有运气：

$(function() {
  $('#main-nav_responsive > ul.menu > li > a').click(function(e) {
    $('#main-nav_responsive > ul.sub-menu').slideUp('normal');
      if($(this).next('#main-nav_responsive > ul.sub-menu').is(':hidden') === true) {    
        $(this).next('#main-nav_responsive > ul.sub-menu').slideDown('normal');
      }
    e.preventDefault();
  });
}); 

有人知道如何使jQuery效果仅适用于移动导航吗？

Answer 1

啊，说得太早了。用这个解决：

$(function() {
  $('#main-nav_responsive ul.menu > li > a').click(function(e) {
    $('#main-nav_responsive ul.sub-menu').slideUp('normal');
      if($(this).next('#main-nav_responsive ul.sub-menu').is(':hidden') === true) {    
        $(this).next('#main-nav_responsive ul.sub-menu').slideDown('normal');
      }
    e.preventDefault();
  });
});