jQuery Scroll div滚动条样式更改
<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
<script type="text/javascript" src="js/jquery.em.js"></script>
<script type="text/javascript" src="js/jScrollPane.js"></script>
<script type="text/javascript"> $(function()
{
// this initialises the demo scollpane on the page.
$('#pane1').jScrollPane();
}); </script>
常用的参数配置项
1、showArrows:是否显示滚动箭头,模式是false;
2、maintainPosition:当滚动区重新初始化后,是否保持滚动条的原有位置,默认是true;
3、stickToBottom:当maintainPosition设置为true,且滚动区域到达底部,当有新内容添加的时候任然会固定在滚动区域底部,默认是false;
4、stickToRight:与stickToBottom属性原理类似,只是方向是右侧而不是底部;
5、autoReinitialise:自动初始化滚动区,内部实现机制实际上是一个定时器,当检测到内部有内容新增时,重新初始化,由于性能原因,默认false;
6、autoReinitialiseDelay:当autoReinitialise设置为true时,该属性表示自动初始化的延时,默认是500ms;
7、verticalDragMinHeight:垂直可拖动的最小高度,默认是0;
8、verticalDragMaxHeight:垂直可拖动的最大高度,默认是99999;
9、horizontalDragMinWidth:水平可拖动的最小距离,默认是0;
10、horizontalDragMaxWidth:水平可拖动的最大距离,默认是99999;
11、contentWidth:滚动区域的宽度,一般不要设置,该插件会根据内容实际宽度计算,默认undefined;
12、animateScroll:当调用scrollTo 或者scrollBy的时候,设置一个动画效果,包括时长duration和渐变ease,默认false;
13、animateDuration:动画时长,默认300ms;
14、animateEase:动画渐变函数,默认linear;
15、hijackInternalLinks:劫持锚链接,定位到滚动区域指定位置,默认false;
16、verticalGutter:垂直方向,内容和滚动条之间的距离,默认是4px;
17、horizontalGutter:水平方向,内容和滚动条之间的距离,默认是4px;
18、mouseWheelSpeed:鼠标滚轮的速度,默认是10px;
19、arrowButtonSpeed:方向按钮滚动内容的速度,默认是10px;
20、arrowRepeatFreq:按住方向按钮,内容滚动的频率,默认是100ms;
21、arrowScrollOnHover:当鼠标悬浮在方向按钮上时,是否允许滚动,默认false;
22、verticalArrowPositions:垂直方向按钮和固定点的位置,默认split;
23、horizontalArrowPositions:同上,水平方向;
24、enableKeyboardNavigation:是否允许键盘导航,默认true;
25、hideFocus:是否隐藏焦点框,默认false;
26、clickOnTrack:当点击固定点的时候,是否向相应方向滚动内容,默认true;
27、trackClickSpeed:点击固定点的滚动速度,默认是30px;
28、trackClickRepeatFreq:点击固定点的滚动频率,默认是100ms。
如果要修改滚动条的默认样式可以打开jquery.jscrollpane.css文件修改
jQuery Scroll div滚动条样式更改的更多相关文章
- 【前端】webkit内核浏览器DIV滚动条样式修改和设置
webkit内核浏览器DIV滚动条样式修改和设置 引言: 最近在做自己的小项目,为了设计出好看的页面费劲了心思,大到页面的整体布局,小到DIV的滚动条都不放过,以下是我通过查阅资料总结的webkit内 ...
- jquery两个滚动条样式
jquery两个滚动条样式 点击下载
- jQuery 自定义网页滚动条样式插件 mCustomScrollbar 的介绍和使用方法(转)
系统默认的滚动条样式,真的已经看的够恶心了.试想一下,如果在一个很有特色和创意的网页中,出现了一根系统中默认的滚动条样式,会有多么的别扭. 为了自己定义网页中的滚动条的方法,我真的已经找了很久了,就目 ...
- jquery判断div滚动条到底部
jQuery 里和滚动条有关的概念很多,但是有三个属性和滚动条的拖动有关,就是:scrollTop.scrollLeft.scrollHeight.其中 scrollHeight 属性,互联网上几乎搜 ...
- HTML div 滚动条样式设计
::-webkit-scrollbar-track-piece{ background-color:#fff;/*滚动条的背景颜色*/ -webkit-border-radius:0;/*滚动条的圆角 ...
- 修改DIV滚动条样式
/*滚动条样式*/ div::-webkit-scrollbar { /*滚动条整体样式*/ width: 5px; /*高宽分别对应横竖滚动条的尺寸*/ height: 5px; } div::-w ...
- JQuery 控制div滚动条保持最下
$("#session_show").animate({ scrollTop: $("#session_show").scrollHeight },1000); ...
- HTML+CSS 滚动条样式自定义 - 适用于 div,iframe, html 等
友言:这两天被滚动条整的无与伦比,在此做下总结: 首先自定义浏览器滚动条的实现原理:计算浏览器滚动条的高度,层级1的高度与滚动条的总高度是一样的,通过相似比例计算: 浏览器滚动条总高度 :滚动条高度 ...
- jQuery自定义滚动条样式插件mCustomScrollbar
如果你构建一个很有特色和创意的网页,那么肯定希望定义网页中的滚动条样式,这方面的 jQuery 插件比较不错的,有两个:jScrollPane 和 mCustomScrollbar. 关于 jScro ...
随机推荐
- Install FFmpeg, Mplayer, Mencoder, MP4Box, Flvtool2
You can use the following tutorial to install ffmpeg and other video modules in your centos server.F ...
- 【学习笔记】【oc】copy与mutableCopy
copy 返回一个不可变的对象: mutableCopy 返回一个可变的对象: 使用copy方法时 类必须实现:<NSCopying>协议中的-(id)copyWithZone:(NSZo ...
- BZOJ 2300 防线修建
http://www.lydsy.com/JudgeOnline/problem.php?id=2300 题意:给点,有以下操作:删去一个点,询问这些点构成凸包的周长. 思路:用splay维护上凸壳, ...
- C51的编程规范
现在单片机的程序设计,C51已经得到广泛的推广和应用,算是单片机的主流设计程序,甚至可以说作为单片机开发人员必须要掌握的一门语言了.作为一门工具,最终的目的就是实现功能.在满足这个前提条件下,我们希望 ...
- C51的一些误区和注意事项
1) C忌讳绝对定位.常看见初学者要求使用_at_,这是一种谬误,把C当作ASM看待了.在C中变量的定位是编译器的事情,初学者只要定义变量和变量的作用域,编译器就把一个固定地址给这个变量.怎么取得这个 ...
- android http协议post请求方式
方式一:HttpPost(import org.apache.http.client.methods.HttpPost 代码如下: private Button button1,button2,but ...
- SolrCloud 5.2.1 installation and configuration
虽然不是很有技术含量的事情,主要依靠的是阅读能力,然而知识的东西还是记录一下,以备后继待查. 环境相关 1. Server:h1,h2,h3 2. OS RHEL 6.2 3. Zookeeper 3 ...
- BZOJ3389: [Usaco2004 Dec]Cleaning Shifts安排值班
3389: [Usaco2004 Dec]Cleaning Shifts安排值班 Time Limit: 1 Sec Memory Limit: 128 MBSubmit: 45 Solved: ...
- HDU_2019——向排序好的数列中插入数
Problem Description 有n(n<=100)个整数,已经按照从小到大顺序排列好,现在另外给一个整数x,请将该数插入到序列中,并使新的序列仍然有序. Input 输入数据包含多 ...
- 51nod-正整数分组问题(基础方程DP-01背包)
正整数分组 将一堆正整数分为2组,要求2组的和相差最小. 例如:1 2 3 4 5,将1 2 4分为1组,3 5分为1组,两组和相差1,是所有方案中相差最少的. 思路: 这题的实质其实也是0-1背包问 ...