提问者:小点点

当窗口宽度等于600px时,如何禁用覆盖滚动条?


我使用overlayScrollbars创建一个

当窗口宽度小于600px时,则navbar像边栏一样左转。

    <ul>
      <li>test 1</li>
      <li>test 2</li>
      <li>test 3</li>
    </ul>

创建一个js文件并添加这一行:

$('ul').overlayScrollbars({ });

现在,当我的widnow宽度小于600px时,overlayscrollbar工作很好,但是当我的窗口宽度大于600px时,overlayscrollbar仍然工作,元素宽度就像侧边栏一样。

当窗口宽度大于600px时,如何禁用overlayScrollbars()?


共2个答案

匿名用户

您需要:

  1. 将覆盖实例存储为变量,以便您可以.destroy()它们。
  2. 打开页面时检查窗口大小,并根据大小创建窗口。
  3. .destroy()和重新创建新实例附加到onResize事件,检查方式与加载页面时相同。

下面是一个如何使用jQuery存储和销毁的示例。

//initializes plugin and stores the instance into a variable
var instance = $('ul').overlayScrollbars({ }).overlayScrollbars();
instance.destroy();

匿名用户

HTML

<ul id="test">
    <li>test 1</li>
    <li>test 2</li>
    <li>test 3</li>
</ul>

jQuery

So you get it onload
--------------------

if($(window).width() < 600) {
    var instance = OverlayScrollbars(document.getElementById("test"), {});
}

$(window).resize(function() {
  var instance = OverlayScrollbars(document.getElementById("test"), {});
  if ($(window).width() > 600) {
    instance.destroy();
  }
});