Antiscroll 滚动条插件

       Antiscroll是一个自定义滚动条的插件,能够跨浏览器使用,显示效果为OSX Lion风格,轻量级的网页开发插件,大小只有1KB左右,支持多个浏览器显示效果,动画采用CSS3动画,显示性能流程优异,Antiscroll解决了开发网页中,JavaScript UI通常会面临的一个问题,我如何自定义滚动条,从而保持他已有的特性。

特点

  • 支持鼠标的滑轮mousewheels,触摸板和其他输入设备
  • 压缩版本只有1KB左右大小
  • 没有使用其他任何多余的DIV,代码简洁高效
  • 淡入/淡出的CSS3动画控制。
  • 鼠标悬停或者触摸才会显示滚动条,最大限度的显示内容
  • 支持滚动条拖动
  • 根据容器的大小,自动调节滚动条的位置和长度
  • 支持IE7,Firefox 3,Chrome,Safari,Opera

使用方法

1、在网页的顶部引入样式

2、在网页的底部引入JS文件,这个插件依赖于jQuery框架和jquery-mousewheel.js文件

3、给外层的DIV盒子添加antiscroll-inner样式,给内容的盒子添加antiscroll-wrap样式,调用插件

  1. $(function () {
  2.     $('.antiscroll-wrap').antiscroll();
  3. });

配置参数

你可以将通过自动滚动条隐藏在一个关键值的antiscroll()像这样:

  1. $(function () {
  2.     $('.antiscroll-wrap').antiscroll({
  3.         autoHide: false
  4.     });
  5. });

项目地址:https://github.com/LearnBoost/antiscroll

文章转载自:问说网 » Antiscroll跨浏览器自定义OSX Lion滚动条插件


你可能感兴趣的:(Antiscroll 滚动条插件)