插件描述：jQuery猫咪滚动进度条，快速到达文档底部和顶部以及其他一些小功能
更新时间：2021-02-01 00:09:31
更新说明：添加了自动生成目录的功能，以实现快速导航
一个页面有多个neko scroll时，需要设置nekoname来区分不同的neko scroll，虽然如此，但还请一个页面一个neko scroll，不然会出问题，节点名冲突，主要是我懒得改了
nekoname其实就是id,默认为neko
默认（去掉以下注释，并注释掉其他的查看效果)
1 | //$("#myscoll").nekoScroll(); |
部分自定义
1 2 3 4 5 6 7 | $("#myscoll").nekoScroll({ blog_body: ".blog-body", //所有目录标题的父节点，为了更好的定位目录，如 .classname,#idname,tagname，默认为标签 body，建议不使用默认，最好另外设置该选项 catalog_item: ".catalog-item", //目录标题的选择器，为了识别博客文章目录，如 .classname,#idname,tagname，默认为标签 h3，建议不使用默认，最好另外设置该选项 readColor: "red", //已经阅读过内容的目录颜色 readColor: "#70a1ff", //已经阅读过内容的目录颜色,默认为 #109DFF unreadColor: "#57606f" //未阅读过内容的目录颜色，默认为 #2f3542}); |
自定义（ 去掉以下注释， 并注释掉其他的查看效果）
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | $("#myscoll1").nekoScroll({ nekoname:'neko1', //nekoname，相当于id nekoImg:'img/猫咪.png', //neko的背景图片 scImg:"img/绳1.png", //绳子的背景图片 bgcolor:'#1e90ff', //背景颜色，没有绳子背景图片时有效 zoom:0.9, //绳子长度的缩放值 endMsg:'已经结束了', //滑动到底部后的对话框信息 hoverMsg:'你好~喵', //鼠标浮动到neko上方的对话框信息 right:'100px', //距离页面右边的距离 fontFamily:'楷体', //对话框字体 fontSize:'14px', //对话框字体的大小 color:'#1e90ff', //对话框字体颜色 scroWidth:'8px', //绳子的宽度 z_index:100, //不用解释了吧 during:1200, //从顶部到底部滑动的时长 blog_body:".blog-body", //所有目录标题的父节点，为了更好的定位目录，如 .classname,#idname,tagname， 默认为标签 body，建议不使用默认，最好另外设置该选项 catalog_item:".catalog-item", //目录标题的选择器，为了识别博客文章目录，如 .classname,#idname,tagname，默认为标签 h3，建议不使用默认，最好另外设置该选项 readColor:"red", //已经阅读过内容的目录颜色 unreadColor:"black" //未阅读过内容的目录颜色}); |
更新时间：2021-01-19 21:21:48
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | // 默认 $("#myscoll").nekoScroll();//自定义 $("#myscoll1").nekoScroll({ nekoname: 'neko1', //nekoname，相当于id nekoImg: 'img/猫咪.png', //neko的背景图片 scImg:"img/绳1.png", //绳子的背景图片 bgcolor: '#1e90ff', //背景颜色，没有绳子背景图片时有效 zoom: 0.9, //绳子长度的缩放值 endMsg: '已经结束了', //滑动到底部后的对话框信息 hoverMsg: '你好~喵', //鼠标浮动到neko上方的对话框信息 right: '200px', //距离页面右边的距离 fontFamily: '楷体', //对话框字体 fontSize: '14px', //对话框字体的大小 color: '#1e90ff', //对话框字体颜色 scroWidth: '8px', //绳子的宽度 z_index: 100, //不用解释了吧 during: 1200 //从顶部到底部滑动的时长}); |
具体可以下载源文件查看
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： jQuery弹窗插件syalert.js
- 下一个特效： jQuery树插件ztree用户选择