建站资源下载详情
为您免费提供多种建站资源下载,包括网站模板下载、前端插件下载和字体下载!您只需注册为会员即可任意下载!

JS网页滚动条插件simplebar.js

来源:易助科技网浏览量:16收藏

简介

SimpleBar是一个简单的、独立的JavaScript库,添加一个自定义滚动条滚动容器已满溢的内容,使用方法很简单。

(下载的附件中附有DEMO)


使用

1.  引入文件


<link rel="stylesheet" href="https://unpkg.com/simplebar@latest/dist/simplebar.css" />
<script src="https://unpkg.com/simplebar@latest/dist/simplebar.js"></script>

<!-- or -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/simplebar@latest/dist/simplebar.css">
<script src="https://cdn.jsdelivr.net/npm/simplebar@latest/dist/simplebar.js"></script>


2.  HTML


<div data-simplebar></div>


3.  调用

初试化:


new SimpleBar(document.getElementById('myElement'));

or

Array.from(document.querySelectorAll('.myElements')).forEach(el => new SimpleBar);


JQuery方式使用:


new SimpleBar($('#myElement')[0]);or$('.myElements').each(element, new SimpleBar);



相关链接

GitHub 地址 :https://github.com/marcoarib/simplebar

官方文档:https://grsmto.github.io/simplebar/

在线演示:http://www.bootstrapmb.com/item/12254/preview