jQuery:我的下拉菜单不需要的行为(桌面和移动)

我用jQuery和一些css/scs构建了一个下拉列表。乍一看,它是有效的,但我认为总是有一些错误是由于jQuery代码或不必要的CSS规则造成的。我只是不确定他们中的哪一个。。

你可以在这里看到当前的状态。所述下拉菜单是导航栏中的“Leistungen”项:

https://www.s-wat.de

尤其是在移动视区出现错误。如果我在这里打开下拉列表,并在打开状态下单击另一个点(例如“Kontakt”),然后再次单击“Leistungen”,则会出现不需要的淡入淡出效果。在我可以正常打开之前,下拉列表将先打开和关闭。

这是我的jQuery代码:

(function($) {
    "use strict"; // Start of use strict

    // Closes responsive menu when a scroll trigger link is clicked
    $('.first .js-scroll-trigger, .last .js-scroll-trigger, .dropdown-menu .js-scroll-trigger').click(function() {
      $('.navbar-collapse').collapse('hide');
      if (!$('.dropdown-menu').hasClass('show')) {
        $('.dropdown-menu').fadeOut('slow');
      }
      $('.dropdown-menu').removeClass('show');
      $('.dropdown').removeClass('show');
    });

    var navbarBehave = function(){
      if ($(window).width() < 992){
        $('.dropdown-toggle').click(function() {
          if (!$('.dropdown-menu').hasClass('show')) {
            $('.dropdown-menu').fadeIn('slow');
          }else{
            $('.dropdown-menu').fadeOut('slow');
          }
        }); 
      }else{
        $('.dropdown-toggle').hover(function() {
          if (!$('.dropdown-menu').hasClass('show')) {
            $('.dropdown-menu').fadeIn(300);
          }else{
            $('.dropdown-menu').fadeOut(300);
          }
        });     
      }
    }

    navbarBehave();

    $(window).resize(function(){
      navbarBehave();
    });   

  })(jQuery); // End of use strict