jQuery tinyscrollbar插件

   今天做项目遇到了一个tinyscrollbar插件很不错，原版的英文地址是http://www.baijs.nl/tinyscrollbar/，可以做出很多效果，

大体的调用格式就是：

$('#scrollbar1').tinyscrollbar(【options】);

options有一下几个参数选项：

其中包括可选参数和默认值

axis: 'x' -- 表示坐标的水平或者垂直'x' or 'y' .

wheel: 40 -- 表示鼠标滑轮一次滚动多少个像素的区域

scroll: true --是否禁用滚轮，默认不禁用（不常用）

lockscroll: true -- 如果没有更多内容的时候，锁定滚动条（不常用）

size: 'auto' -- 设置滚动条的高度度，可以为一个固定的像素值

sizethumb: 'auto' -- 设置滚动条的宽度，可以为一个固定的像素值

 

其中tinyscrollbar还有一个非常好用的方法：

$("#scrollbar").tinyscrollbar_update()

此用法表示页面内容发生变化的时候，实际就是浏览器的大小发生变化的时候，通过即时的盗用此方法，可改变滚动条的样式，所以一般习惯性绑定在$(window).resize();上面

即：

$(window).resize(function(){
    $("#scrollbar").tinyscrollbar_update();
})

同时tinyscrollbar插件对页面html的代码有着特殊的要求，因为很多div包括其类名是封装在插件里面的，轻易不会改动

大体格式如下：（样式问题就不多说了 设置好宽高  overflow等，找好滚动条的素材即可）

<div id="scrollbar1">
        <div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div>
        <div class="viewport">
             <div class="overview">
                <!--此处添加的内容 codes here-->
            </div>
        </div>
</div>