使用nicescroll插件时,Navbar不会滚动显示较小设备上的链接

时间:2016-09-05 16:47:30

标签: jquery html css twitter-bootstrap

我正在使用漂亮的滚动插件,在较小的设备上,导航栏不会显示所有链接,也没有滚动条可以查看所有链接。我尝试在我的配置上添加.navbar-collapse以获得漂亮的滚动插件,如下所示。它不起作用。

$("html, .navbar-collapse, .modal").niceScroll({
    cursorcolor: '#F05F40',
    cursoropacitymin: '0',
    cursoropacitymax: '1',
    cursorwidth: '6px',
    zindex: 10000,
    scrollspeed: 200,
    mousescrollstep: 80,
    horizrailenabled: false,
});

我也尝试将以下属性添加到我的CSS但没有获胜。

.navbar-default {
  max-height: 51px; 
}

.navbar-collapse {
  max-height: none; 
}

@media (max-width: 768px){
  .navbar-default {
    max-height: none;
  }
}

如何在小型设备上为导航栏添加滚动条?

1 个答案:

答案 0 :(得分:1)

在CSS中使用"height"属性而不是"max-height"。该插件将有效。

CODEPEN

的示例代码

我希望它可以帮到你。