クリック後にこのドロップダウンメニューをアクティブにしますか？タッチ

Question

後これはJSではありません、私は「クリック」して「タッチ」に変更しようとするが、何も起こりません：

$(document).ready(function(){ 
    var touch = $('#resp-menu'); 
    var menu = $('.menu'); 

    $(touch).on('click', function(e) { 
     e.preventDefault(); 
     menu.slideToggle(); 
    }); 

    $(window).resize(function(){ 
     var w = $(window).width(); 
     if(w > 767 && menu.is(':hidden')) { 
      menu.removeAttr('style'); 
     } 
    }); 

}); 

あなたがここに完全なドロップダウンメニューを見ることができます： http://codepen.io/anon/pen/ygbpmV

Answer 1

実際にはonclick関数を設定しています。 これをデベロッパーコンソールに書き込むことでこれをテストできます。

var touch = $('#resp-menu'); 
touch.click(); 

「タッチ」要素が表示されないため、クリックできないという問題があります。 おそらく、あなたはイベントが起こる場所を再度考えなければなりません。

Answer 2

.menu li:hover>ul { 
    visibility: visible; 
    opacity: 1; 
    transform: translate(0,0); 
} 

.menu li.active>ul { 
    visibility: visible; 
    opacity: 1; 
    transform: translate(0,0); 
} 

JS

$(document).ready(function(){ 
    var touch = $('#resp-menu'); 
    var menu = $('.menu li'); 

    $(menu).on('click', function(e) { 
     e.preventDefault(); 
     $(this).addClass('active'); 
    }).on('mouseleave',function(){ 
    $(this).removeClass('active'); 
    }); 

    $(window).resize(function(){ 
     var w = $(window).width(); 
     if(w > 767 && menu.is(':hidden')) { 
      menu.removeAttr('style'); 
     } 
    }); 

}); 

と交換