slimscroll插件使用

发表于 | 更新于: | 分类于
字数统计: 201 | 阅读时长 ≈ 1

在开发微信聚合平台的时候，需要给公告的div设置个滚轮，防止太大，影响下面元素，各种找插件最后找到slimscroll这个插件，使用起来非常方便，记录下，方便以后查找。

CDN链接，自行下载

0x01 引入插件

1
<script src="{{ url_for('static', filename='common/jquery.slimscroll.min.js') }}"></script>

指定内容

指定id="box"的div设置滚动

1
<div class="layui-card-body1" id="box" style="height: 100px">
2
    {{ announcement.context|safe }}
3
</div>

绑定元素

1
$(function () {
2
    $('#box').slimScroll({
3
        height: '100', //容器高度
4
        size: "6px", //滚动条宽度
5
        color: "#009688", //滚动条颜色,默认#000000
6
        alwaysVisible: true, //是否禁用隐藏滚动条,默认false
7
        opacity: 4,  // 滚动条透明度
8
    })
9
})