touchslider实现触屏自动播放相册

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

现在做页面,对触民屏的要求越来越高,这主要是由于手机网站越来越普及,而最主要的原因是智能手机的迅速发展。。。

那么,对于我们做页面的人来说,我们需要在手机或IPAD上实现触屏的功能,我们经常可以见到,许多触屏网站都有相册的功能,而大家可以用手去切换图片,也就类似于我们的鼠标,这多亏了JS里的touch事件。

那么,作为JQUERY的爱好者,我们今天也来实现一个触屏相册,这里,我们需要引进一个插件:jquery.touchslider.js。关于这个插件,大家可以先看下这个网站:http://touchslider.com/,相信,这个网站能让你对触屏技术有进一步了解。

我们今天实现了两个相册,一个是带自动功能的,一个是手动切换的。

我们可以看到,你要实现触屏,就是写上mouseTouch,让它为true,要实现自动播放,就写上autoplay,让它为true。

功能是实现了,不过,相对于复杂的相册,还是有不足的,比如出现上面的图片标题及简介,另外,底部图片没办法实现循环滚动,这个我还得好好努力,希望可以给大家带来一个漂亮的相册。

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

预览地址:http://www.163css.net/net163/cssjs/2012/11/touchpic/index.html

下载地址:touchslider实现触屏自动播放相册.zip

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