滚动条美化插件 nicescroll
这个插件使用起来非常简单,首先下载插件jquery.nicescroll.min.js
然后在页面中引入jquery,再引入这个插件,
然后在页面中需要修改滚动条的地方,例如id为box的div
<div id="box">
在js中给这个div添加一个方法就可以了:
$("#box").niceScroll();
具体参数,可以查看插件的api文档:
实例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.box {
width: 500px;
height: 500px;
margin: 0 auto;
border: 1px solid blue;
overflow-y: scroll;
}
.box div {
height: 1000px;
}
</style>
<script src="../../lib/jquery-3.2.1.min.js"></script>
<script src="../../lib/jquery.nicescroll.min.js"></script>
<script>
$(function() {
$("#box").niceScroll({
cursorcolor: "#ff0000"
});
});
</script>
</head> <body>
<div class="box" id="box">
<div></div>
</div>
</body> </html>
效果为:
滚动条美化插件 nicescroll的更多相关文章
- mcustomscrollbar滚动条美化插件
mCustomScrollbar 是个基于 jQuery UI 的自定义滚动条插件,它可以让你灵活的通过 CSS 定义网页的滚动条,并且垂直和水平两个方向的滚动条都可以定义,它通过 Brandon A ...
- scrollBot滚动条美化,niceScroll有滚动条错位得问题
http://www.htmleaf.com/Demo/201706204585.html
- jq滚动条美化
https://github.com/inuyaksa/jquery.nicescroll(插件地址) https://blog.csdn.net/zyy_0725/article/details/8 ...
- 代码高亮美化插件-----SyntaxHighlighter
IT类文章博客,代码高亮美化插件-----SyntaxHighlighter 最近在做一个类似个人博客的网站,因为文章中会用到各种代码,主要是Javascript,CSS,PHP,XML等.这些代码如 ...
- webkit之滚动条美化
由于公司的产品改用webkit内核,在写公共css的时候,不想使用插件模拟,顺便网上查阅了下css3的滚动条美化. 首先,先上一副示意图. 从网络上盗图的(来源 http://zhangyaochun ...
- jQuery下拉框扩展和美化插件Chosen
Chosen 是一个支持jquery的select下拉框美化插件,它能让丑陋的.很长的select选择框变的更好看.更方便.不仅如此,它更扩展了select,增加了自动筛选的功能.它可对列表进行分组, ...
- jQuery自定义滚动条样式插件mCustomScrollbar
如果你构建一个很有特色和创意的网页,那么肯定希望定义网页中的滚动条样式,这方面的 jQuery 插件比较不错的,有两个:jScrollPane 和 mCustomScrollbar. 关于 jScro ...
- JavaScript/jQuery 表单美化插件小结
Niceforms Niceforms是一款独立的表单美化工具,当前版本为2.0 官方主页:http://www.emblematiq.com/lab/niceforms/ 官方演示:http://w ...
- NSIS:简单按钮美化插件SkinButton,支持透明PNG图片。
原文 NSIS:简单按钮美化插件SkinButton,支持透明PNG图片. 征得作者贾可的同意,特发布按钮美化插件SkinButton. 插件说明: 使用GDI+库写的一个简单按钮美化插件,支持透明P ...
随机推荐
- 系列文章-- SSIS学习
SSIS是SQL Server Integraion Services的简称.是生成高性能数据集成解决方案(包括数据仓库的提取.转换和加载 (ETL) 包)的平台. SSIS组件转换_模糊查找转换 ...
- javacpp-FFmpeg系列之2:通用拉流解码器,支持视频拉流解码并转换为YUV、BGR24或RGB24等图像像素数据
javacpp-ffmpeg系列: javacpp-FFmpeg系列之1:视频拉流解码成YUVJ420P,并保存为jpg图片 javacpp-FFmpeg系列之2:通用拉流解码器,支持视频拉流解码并转 ...
- [转]BFC 神奇背后的原理
BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等).虽然我知道如何利用 BFC 解决这些问题, ...
- DB2 Error Messages (Sorted by SQLCODE)
DB2 Error Messages (Sorted by SQLCODE) DB2 Error Messages (Sorted by SQLCODE) SQLCODE SQLSTATE Descr ...
- mysql5.1的编译安装 ----针对第一次安装mysql的
由于是第一次安装,不能确定你是否有安装编译和mysql所要依赖的插件,使用我是当做你最原始的安装环境. 1.安装mysql5.1的依赖包 yum install -y gcc gcc-c++ aut ...
- JAVA基础知识 String s = new String("ABC") VS String s = "abc"
一: String s = new String("ABC") VS String s = "abc" String s = "abc&q ...
- 数据字典生成工具(生成Excel, Word,PDF,html)
转自:http://www.cnblogs.com/yanweidie/p/3838765.html 数据字典生成工具之旅系列文章导航 数据字典生成工具之旅系列文章导航 宣传语 数据字典生成工具.数据 ...
- hdu 4123 Bob’s Race (dfs树上最远距离+RMQ)
C - Bob’s Race Time Limit:2000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u Subm ...
- string行读入&&文件输入
普通读入的时候会以空格作为分隔符 直接用cin>>s读入,此时可以直接处理文件尾的情况 text代码: #include <iostream>#include <cstd ...
- 洛谷P3379 【模板】最近公共祖先(LCA)(dfs序+倍增)
P3379 [模板]最近公共祖先(LCA) 题目描述 如题,给定一棵有根多叉树,请求出指定两个点直接最近的公共祖先. 输入输出格式 输入格式: 第一行包含三个正整数N.M.S,分别表示树的结点个数.询 ...