博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery库 之 jquery slimscroll插件使用
阅读量:5231 次
发布时间:2019-06-14

本文共 2010 字,大约阅读时间需要 6 分钟。

 

What is slimScroll? 
slimScroll is a small (4.6KB) jQuery plugin that transforms any div into a scrollable area with a nice scrollbar.slimScroll doesn’t occupy any visual space as it only appears on a user initiated mouse-over. User can drag the scrollbar or use mouse-wheel to change the scroll value.

(译) 

slimscroll是什么? 
slimscroll是一个4.6kb的jQuery插件,把任何div元素包裹的内容区加上具有好的滚动条。slimscroll不占用任何视觉空间,它只出现在一个用户启动的鼠标。用户可以拖动滚动条或使用鼠标滚轮改变滚动值。

插件下载地址: 

稳定、快速、免费的开源项目 CDN 服务:(点击查看最新插件CDN地址)

使用方法: 

1.引入jQuery插件(此处使用谷歌CDN服务,1.9.0版本):

1 

2.引入本插件:

或者使用CDN服务(1.3.6版本):

3.将要设置的内容外加div元素包裹(p标签内为我要设置的内容)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus, felis interdum condimentum consectetur, nisl libero elementum eros, vehicula congue lacus eros non diam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus mauris lorem, lacinia id tempus non, imperdiet et leo. Cras sit amet erat sit amet lacus egestas placerat. Aenean ultricies ultrices mauris ac congue. In vel tortor vel velit tristique tempus ac id nisi. Proin quis lorem velit. Nunc dui dui, blandit a ullamcorper vitae, congue fringilla lectus. Aliquam ultricies malesuada feugiat. Vestibulum placerat turpis et eros lobortis vel semper sapien pulvinar.Pellentesque rhoncus aliquet porta. Sed vel magna eu turpis pharetra consequat ut vitae lectus. In molestie sollicitudin mi sit amet convallis. Aliquam erat volutpat. Nullam feugiat placerat ipsum eget malesuada. Nulla facilisis nunc non dolor vehicula pretium. Sed dui magna, sodales id pharetra non, ullamcorper eu sapien. Mauris ac consectetur leo. Mauris consequat, lectus ut bibendum pulvinar, leo magna feugiat enim, eu commodo lacus sem vel ante. Sed tempus metus eget leo mollis vulputate. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.

4.载入slimscroll插件(记得一定在DOM树加载完才能为元素绑定插件)

以上就是一个简单的slimscroll插件的使用

附上效果图(PS:右边的滚动条可以看出内容区是支持滚动的)

 slim scroll demo

转载于:https://www.cnblogs.com/wiz-Chen/p/4748796.html

你可能感兴趣的文章
《Photoshop CS4手绘艺术技法》
查看>>
random
查看>>
使用CSP防止XSS攻击
查看>>
unity3d--NGUI制作中文字体
查看>>
Bean属性的常用配置
查看>>
Spring容器中Bean的生命周期
查看>>
Springboot使用步骤
查看>>
Spring其他注解
查看>>
Spring属性注入
查看>>
Springboot-配置文件
查看>>
Spring-自动配置
查看>>
Springboot-日志框架
查看>>
SpringBoot-静态资源映射
查看>>
SpringBoot-webjars
查看>>
SpringBoot-thymeleaf
查看>>
IDEA 调试 JAVA ConcurrentLinkedQueue
查看>>
P1908-逆序对
查看>>
P1192-台阶问题
查看>>
ACM模板——康托展开
查看>>
P1025-数的划分
查看>>