하위 메뉴를 클릭하십시오

Question

여기에 StackOverflow에 아주 좋은 질문을 발견했습니다 jQuery show submenu if parent have been clicked. 그럼 난 jsfiddle, http://jsfiddle.net/JtAeh/4/ 내 CSS와 HTML을 사용해보십시오. 그것은 효과가있다! 그러나 내가 사용하고있는 WordPress의 테마에는 새로운 커스텀 스크립트를 능가하는 스크립트가 있습니다.

부모 테마의 스크립트를 하위 테마의 사용자 정의 스크립트로 우아하게 덮어 쓸 수 있습니까?

아니면 :

$('ul li a').click(function() { 
    $(this).parent().find('ul.sub-menu').toggle(); 
    return false; 
}); 

이 깔끔한 스크립트에

var mobile_menu = function() { 
     if($(window).width() < 600 && $('body').hasClass('responsive')) {    
      $('#nav > ul, #nav .menu > ul').mobileMenu({ 
       subMenuDash : '-' 
      }); 

      $('#nav > ul, #nav .menu > ul').hide(); 
     } 
    } 
    mobile_menu(); 

    var show_dropdown = function() 
    {   
     var options;    

     containerWidth = $('#header').width(); 
     marginRight = $('#nav ul.level-1 > li').css('margin-right'); 
     submenuWidth = $(this).find('ul.sub-menu').outerWidth(); 
     offsetMenuRight = $(this).position().left + submenuWidth; 
     leftPos = -18; 

     if (offsetMenuRight > containerWidth) 
      options = { left:leftPos - (offsetMenuRight - containerWidth) };  
     else 
      options = {}; 

     $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).css(options).stop(true, true).fadeIn(300);  
    } 

    var hide_dropdown = function() 
    {        
     $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).fadeOut(300);  
    } 

    $('#nav ul > li').hover(show_dropdown, hide_dropdown); 

:이 스크립트를 변경할 수 있습니까?

.hover을 .click 및 .fadeIn(300)에서 .toggle으로 변경하려고했으나 효과가 없었습니다.

누군가이 질문에 답변 할 수 있기를 바랍니다.

는

Answer 1

당신은 호버에 다른 이벤트 핸들러를 제거하는 시도하거나 당신이 당신 추가하기 전에 적절한 중 이벤트 (클릭 수 :.

$('ul li a').unbind('click').click(function() { 
    $(this).parent().find('ul.sub-menu').toggle(); 
    return false; 
}); 

Answer 2

을 나는 테마 개발자의 도움을 얻었다 그는 나에게 회전이 스크립트를 전송 클릭 메뉴에 메뉴가 아닌 호버 메뉴 :

var show_dropdown = function() 
    { 
     if($(this).children('ul').length > 0) { 
      var options; 

      containerWidth = $('#header').width(); 
      marginRight = $('#nav ul.level-1 > li').css('margin-right'); 
      submenuWidth = $(this).find('ul.sub-menu').outerWidth(); 
      offsetMenuRight = $(this).position().left + submenuWidth; 
      leftPos = -18; 

      if (offsetMenuRight > containerWidth) 
       options = { left:leftPos - (offsetMenuRight - containerWidth) }; 
      else 
       options = {}; 

      $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).css(options).stop(true, true).fadeIn(300); 
      return false; 
     } else { 
      window.location = $(this).children('a').attr('href'); 
     } 
    } 

    var hide_dropdown = function() 
    { 
     if($(this).children('ul').length > 0) { 
      $('ul.sub-menu:not(ul.sub-menu li > ul.sub-menu), ul.children:not(ul.children li > ul.children)', this).fadeOut(300); 
      return false; 
     } 
    } 

    $('#nav ul > li').toggle(show_dropdown, hide_dropdown); 

지금 내가 좀 더 다른 하나를 열 때 숨길 수있는 하위 메뉴를 얻기 위해 조정할 것을 시도 할 것이다는 ... 답변 주셔서 감사합니다.