jquery图片切换插件jquery.cycle.js使用的一个例子
循环是一个很棒的jQuery图片切换插件，它提供了强大的功能，帮助您更轻松地使用插件的幻灯片特性。下载循环插件并介绍它，此时请注意引入jQuery主文件之后引入的代码。
复制代码代码如下所示：
jquery.cycle.all.js在演示代码。
循环插件可以作用于页面中的任何一组对等元素。
文档中的HTML文档是包含商品和相关信息的封面的列表，它可以添加到HTML文档的主体中：
复制代码代码如下所示：
联想A3000（8GB /白色）
平板电脑、平板电脑
三星银河Note 3
三星Note系列的第三代产品，配备5.7英寸全高清炫丽屏（Super AMOLED），
分辨率为1080p（1920×1080像素）
iPad Air
iPad Air有着惊人的iPad超薄和轻量化，通过一系列的改进，我们将iPad Air
上一代iPad的规模几乎比上一代少了1／4。即便如此，当你捡起它时，你仍然会发现它仍然坚固耐用。
在CSS上添加一些样式可以显示在页面上。
复制代码代码如下所示：
HTML，体{
保证金：0；
填充：0；
}
{体
62.5%字体：宋体、黑体、Arial、无衬线字体；
颜色：# 000；
背景：# FFF；
}
UL #品{
列表样式：无；
保证金：0；
填充：0；
身高：210px；
宽度：500px；
溢出：隐藏；
}
UL #货李{
列表样式：无；
保证金：0；
填充：0；
身高：210px；
宽度：500px；
背景颜色：# f79321；
职位：相对；
}
UL #货物李img {
位置：绝对；
左：0；
顶部：0；
宽度：300px；
身高：210px；
}
UL #商品标题{李。
左：300px保证金；
填料：10px；
宽度：180px；
字体粗细：粗体；
字体大小：1.2em；
背景颜色：# 000；
颜色：# FFF；
溢出：隐藏；
}
UL #货物里。作者{
左：300px保证金；
填充物：0 10px 10px 10px；
宽度：180px；
字体粗细：粗体；
背景颜色：# f79321；
颜色：# FFF；
}
这个列表可以被转换成一个交互通过幻灯片循环插件。变换可以通过调用实现的。周期（）对DOM的适当的容器的方法。
复制代码代码如下所示：
$（文档）Ready（函数（）{）
$（#货物）周期（）；
}）；
这个语法非常简单，不可能更简单，就像其他内置jQuery方法一样，我们也在包含DOM元素的jQuery对象中进行了上调。
循环（），即使你不提供任何参数（循环），它也可以帮助我们完成转换工作，这包括修改页面的样式，
因此，每次只显示一个列表项，然后每4秒切换到下一个列表项，以交叉淡入和淡出的方式，如图中所示。
指定插件方法的参数
循环（）方法提供了很多参数，并且这里没有描述每个参数的具体功能。请参阅其他文件。
我们可以修改循环插件的两个幻灯片之间的播放速度和动画格式，并修改幻灯片转换的触发模式。
复制代码代码如下所示：
$（文档）Ready（函数（）{）
$（#商品周期（{）。
超时时间：2000，
速度：200，
暂停：真
}）；
}）；
第一个超时选项用于指定开关幻灯片之间的等待毫秒数（2000），而速度决定了切换本身的毫秒数（200）。
在设置暂停真实案例，幻灯片将暂停鼠标进入时，这是非常有用的当它包含一个可点击的链接的幻灯片。
循环有一个非常重要的参数：FX：作用是选择特殊效果。
复制代码代码如下所示：
$（#商品周期（{）。
外汇：'fade，
超时时间：2000，
速度：200，
暂停：真
}）；
它包括以下特殊效果blindx，盖，curtainx，fadezoom，生长，scrollup，洗牌、乳胶等。
源码下载