jQuery Tools 1.2.5： Scrollable

官方文档： http://flowplayer.org/tools/release-notes/version-1.2.x.html

本例demeo： http://flowplayer.org/tools/demos/scrollable/plugins/navigator.htm

 

现在这个jquery 插件 Scrollable 比较火的，而项目中需要实现这样的效果的

但是在上面的网站上我们只看到这样的效果

可能刚开始看到的时候，以为这个和我们要求的样式很不一样，但是打开FIREBUG，会看到上面的小黑点的的区域内有1,2,3这样的编号，

这个就是当前浏览图片集合的编号，我们的目的就是去掉小黑点，显示数字

通过查看 应用的 css，看到这个定义：

 

.navi

 

 

A

{

 

 

MARGIN: 3px;

 

 

WIDTH: 8px;

 

 

DISPLAY: block;

 

 

BACKGROUND: url(http://flowplayer.org/tools/img/scrollable/arrow/navigator.png) no-repeat 0px 0px; FLOAT: left;

 

 

HEIGHT: 8px;

 

 

FONT-SIZE: 1px

}

上面显示的黑点就是由于背景颜色导致的，所以我们修改成下面这样

.navi

 

 

A

{

 

 

MARGIN: 3px; WIDTH: 8px; DISPLAY: block; FLOAT: left; HEIGHT: 20px; FONT-SIZE: 11px ;

 

 

text-decoration: none

}

 

 

 

 

 

就满足我们的需求了。很简单，不要去想什么参数配置的，那样复杂化了，只要去掉背景色呵呵