bootstrap-4 - 折叠 Bootstrap 和 SimpleBar js 不能一起工作
问题描述
我对 simplebar.js ( https://github.com/Grsmto/simplebar/ ) 和引导折叠元素有疑问。自定义滚动不显示(但已初始化),但默认滚动显示。
使用默认滚动(单击 Item1 和 Item2):
<div class="container" style="height:300px; overflow:auto;">
<ul class="nav nav-pills flex-column">
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#item-1">Item 1</a>
<div id="item-1" class="collapse">
<ul class="nav flex-column ml-3">
<li class="nav-item">
<a class="nav-link active" href="#">Sub 1</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Sub 2</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Sub 3</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="collapse" href="#item-2">Item 2</a>
<div id="item-2" class="collapse">
<ul class="nav flex-column ml-3">
<li class="nav-item">
<a class="nav-link active" href="#">Sub 1</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Sub 2</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Sub 3</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Item 3</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Item 4</a>
</li>
</ul>
</div>
https://jsfiddle.net/r9en2d16/
使用 simplebar.js:
解决方案
推荐阅读
- c# - 你必须调用 Rg.Plugins.Popup.Popup.Init(); 在使用它之前
- ios - 后台模式更新位置多少时间
- python - scipy.integrate.solve_ivp 不清楚如何求解形式为 0=F(t, y(t), y'(t)) 的隐式 ODE
- vba - 将月份添加到上一个单元格日期对于每个循环
- javascript - 如何使用jQuery点击功能删除最近的div?
- python - 参数树不考虑用户输入的数据
- installation - 我们可以在专用的 unix 服务器上安装 SSL 吗?这样如果我打开 https://
,它应该显示安全 - java - 为什么我不能在idea intellij中设置我的jdk路径
- php - 解析期间的Angular 6 / PHP Http失败
- angular - 如何根据记录长度动态添加 bootstrao col-lg {n}