一直懒得写这个效果,但有需求就必须有供应。最近正好有项目需要这东西,所以就把之前写的插件拿来改了下,作为一个单独的插件,等以后有时间再把2个插件合并起来吧。

功能和描述(v1.0):
1.图片无缝左右滚动
2.经过图片显示/隐藏标题(可选)
3.自动循环滚动(可选)
3.鼠标经过停止滚动
4.单个页面可以重复使用
5.兼容IE6+、Chrome、Firefox、Safari、Opera

插件设置和说明(以下参数为默认值):

/* 设置和说明:
=====================================================
// Dom节点
ubMain:".imageScroll",			// 最外层
ubArea:".imageScroll-area",	// 定位层
ubCon:".imageScroll-con",		// 内容
ubItem:".item",					// 列表项
ubPrev:".imageScroll-prev",	// 向上按钮
ubNext:".imageScroll-next",	// 向下按钮
// 效果展现 (开启/关闭参数:on/off)
ubAuto:"on",					// 是否自动播放
ubTitleHover:"on",				// 标题是否滑动显示
// 时间设置 (按毫秒计算:1000毫秒=1秒)
ubTime:5000,					// 自动播放的时间间隔
ubSpeed:500,					// 图片切换的速度
ubTitleSpeed:50				// 标题滑动显示的速度
=====================================================
*/

使用方法:

$(".imageScroll").ublue_imageScroll();

具体使用说明参考:Ublue jQuery Image Carousel(焦点图&图片轮播)

DemoDownload

感谢您的阅读,本文由 蓝色梦想 版权所有。如若转载,请注明出处:蓝色梦想 - Ublue jQuery Image Scroll(无缝滚动)