li 打开时允许在手风琴上移动滚动

Question

我正在处理这个移动菜单，当 li 大于窗口的高度时，我需要允许滚动菜单。我很接近，但如果你打开超过一里，滚动就会中断。

在手机中查看...

https://www.sailpoint.com/

  $('#menu-wip-mobile').on('click', function(e){

//the li

      if($('.dropdown-toggle--submenu'.hasClass('show-submenu')){

// add scroll to mobile menu if li is open
      $('.navbar__menu__container ').css("overflow-y", "scroll");
    } else{

// remove scroll
      $('.navbar__menu__container ').css("overflow-y", "hidden");
    }
    }
  })

还需要在菜单打开时禁用正文滚动。这在测试时非常有效。

 $('.dropdown-toggle--main').unbind('click').click(function(e) {
  // disabling y scrolling when open
    if($(this).parent().hasClass('show')){
       $('body').css("overflow-y", "hidden");
    } else{
       $('body').css("overflow-y", "scroll");
    }
  });

Answer 1

作为一种简单的玩法，您可以尝试为包含大量项目的 LI 设置最大高度，并在此 LI 上添加内部滚动以允许用户滚动到最后一个项目。

试试：

overflow-y: scroll;
max-height: 50vh;

在您的.dropdown-submenu 上。

看起来像这样：查看 LI 中的内部滚动条