scrollLeft实现按钮控制滚动条相册

作者:林炜贤来源:www.163css.com发表时间:(2013-03-11)

我想,大家对于网易这个相册,一定印像深刻:

之前,我们也用网易的代码实现了这个相册,今天,我们通过scrollLeft来实现这个相册吧,但我们加多了滚动条,没有网易做得那么完美啊。

我们先下我们做出来的效果:

如果你理解了scrollLeft的用法,那么我们今天这个例子就容易理解了。

注意上面的画线部分,我在脚本里这样实现:

这就是实现按钮按钮滚动条的关键啦,当然,样式也是要处理的:

至于像小图变大图,点击上面的前头,实现小图切换大图的,大家要可以看看我的JQUERY代码啊。。。想想,scrollLeft,scrollTop的作用还真是巨大啊。。。在dom文档里,经常要用到,大家可要好好学哦。。。

以下我提供源文件,欢迎有需要的朋友下载使用:

预览地址:http://www.163css.net/net163/cssjs/2013/03/scrollalbum/index.html

下载地址:scrollLeft实现按钮控制滚动条相册.zip

返回作者主页:www.163css.com阅读 (4649)
更多 1