正确开启jquery滚动条插件jScrollPane的使用教程
说到这个使用jScrollPane滚动条插件，我有点火了，在网上找到的教程基本上都是像下面这张图片那样教你使用，然鹅没有实际的demo展示，只能是呵呵啦
jScrollPane的简单介绍
jScrollPane是一个jQuery插件，它允许用HTML结构替换浏览器的默认滚动条（在具有溢出的元素上：auto），可以在css中自定义html。jScrollPane的设计灵活但非常易于使用。在您 下载并将相关文件包含在文档头部之后，您只需调用一个JavaScript函数来初始化滚动窗格。您可以使用CSS轻松设置结果滚动条的样式，或从现有主题中进行选择 。展示了jScrollPane的不同特性以及获得支持的多种方法，有许多不同的示例。
引用地址
cdn地址 ：http://www.bootcdn.cn/jScrollPane/
官方网站： http://jscrollpane.kelvinluck.com/
GitHub地址：https://github.com/vitch/jScrollPane
下面重头戏来啦
- 引入 jquery.jscrollpane.css
- 引入 jquery.min.js
- 引入 jquery.jscrollpane.js
- 给需要添加滚动条的容器加上样式
注：使用滚动条插件jScrollPane，一定要有一个容器，简单来说就是要不能要有一个元素（容器）包裹着一些元素，获取到那个容器，然后执行这个对象下的jScrollPane()这个函数
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>demotitle>
<link href="https://cdn.bootcss.com/jScrollPane/2.1.3-rc.1/style/jquery.jscrollpane.css" rel="stylesheet">
<style type="text/css">
* {
padding: 0;
margin: 0;
}
.scroller {
width: 100%;
height: 200px;
overflow: hidden;
}
style>
head>
<body>
<div class="scroller">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in ligula id sem tristique ultrices eget id
neque. Duis enim turpis, tempus at accumsan vitae, lobortis id sapien. Pellentesque nec orci mi, in
pharetra ligula. Nulla facilisi. Nulla facilisi. Mauris convallis venenatis massa, quis consectetur felis
ornare quis. Sed aliquet nunc ac ante molestie ultricies. Nam pulvinar ultricies bibendum. Vivamus diam
leo, faucibus et vehicula eu, molestie sit amet dui. Proin nec orci et elit semper ultrices. Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed quis urna mi, ac dignissim
mauris. Quisque mollis ornare mauris, sed laoreet diam malesuada quis. Proin vel elementum ante. Donec
hendrerit arcu ac odio tincidunt posuere. Vestibulum nec risus eu lacus semper viverra.
Vestibulum dictum consectetur magna eu egestas. Praesent molestie dapibus erat, sit amet sodales lectus
congue ut. Nam adipiscing, tortor ac blandit egestas, lorem ligula posuere ipsum, nec faucibus nisl enim eu
purus. Quisque bibendum diam quis nunc eleifend at molestie libero tincidunt. Quisque tincidunt sapien a
sapien pellentesque consequat. Mauris adipiscing venenatis augue ut tempor. Donec auctor mattis quam quis
aliquam. Nullam ultrices erat in dolor pharetra bibendum. Suspendisse eget odio ut libero imperdiet
rhoncus. Curabitur aliquet, ipsum sit amet aliquet varius, est urna ullamcorper magna, sed eleifend libero
nunc non erat. Vivamus semper turpis ac turpis volutpat non cursus velit aliquam. Fusce id tortor id sapien
porta egestas. Nulla venenatis luctus libero et suscipit. Sed sed purus risus. Donec auctor, leo nec
eleifend vehicula, lacus felis sollicitudin est, vitae lacinia lectus urna nec libero. Aliquam
pellentesque, arcu condimentum pharetra vestibulum, lectus felis malesuada felis, vel fringilla dolor dui
tempus nisi. In hac habitasse platea dictumst. Ut imperdiet mauris vitae eros varius eget accumsan lectus
adipiscing.
Quisque et massa leo, sit amet adipiscing nisi. Mauris vel condimentum dolor. Duis quis ullamcorper eros.
Proin metus dui, facilisis id bibendum sed, aliquet non ipsum. Aenean pulvinar risus eu nisi dictum
eleifend. Maecenas mattis dolor eget lectus pretium eget molestie libero auctor. Praesent sit amet tellus
sed nibh convallis semper. Curabitur nisl odio, feugiat non dapibus sed, tincidunt ut est. Nullam erat
velit, suscipit aliquet commodo sit amet, mollis in mauris. Curabitur pharetra dictum interdum. In posuere
pretium ultricies. Curabitur volutpat eros vehicula quam ultrices varius. Proin volutpat enim a massa
tempor ornare. Sed ullamcorper fermentum nisl, ac hendrerit sem feugiat ac. Donec porttitor ullamcorper
quam. Morbi pretium adipiscing quam, quis bibendum diam congue eget. Sed at lectus at est malesuada
iaculis. Sed fermentum quam dui. Donec eget ipsum dolor, id mollis nisi. Donec fermentum vehicula porta.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum
tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas
semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien
ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean
fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor
neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis,
accumsan porttitor, facilisis luctus, metus
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum
tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu
p>
div>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js">script>
<script src="https://cdn.bootcss.com/jquery-mousewheel/3.1.13/jquery.mousewheel.js">script>
<script src="https://cdn.bootcss.com/jScrollPane/2.1.3-rc.1/script/jquery.jscrollpane.js">script>
<script type="text/javascript">
$(function() {
$('.scroller').jScrollPane();
});
script>
body>
html>
好的就这样，愉快的结束吧！！！