jquery图片切换插件jquery.cycle.js参数详解

2019独角兽企业重金招聘Python工程师标准>>>

Cycle2 是一个流行已久的 jQuery Cycle 幻灯片插件的升级版，它支持响应式的界面，提供了多种参数可自定义设置。它内置了控制界面，同时也能显示图像加载进度，而且还提供了四种变换效果。对于想要打造完全个性化幻灯片的人来说，此插件是非常合适的。

插件功能特性：

• 支持图片加载进度

• 支持移动设备

• 自适应

• 自定义选项（这个应该是插件必须的）

• 支持 上一页、下一页、幻灯片标题、分页导航（1、2、3、4 或者 图片 或者按钮 都是可以的）、覆盖层的控制

粗略看了下，升级后支持，部分之前就支持，应该是有改善，新增的部分在于 移动设备支持、图片加载进度、自适应，更重要实用的应该在于 代码写的更少了，更智能了。

开始基本使用

页面放入 jquery 和 cycle2，代码如下：

<script src="jquery.min.js">
</script>
<script src="/jquery.cycle2.js"></script>

幻灯片 html

<div class="cycle-slideshow">
    <img src="images/p1.jpg">
    <img src="images/p2.jpg">
    <img src="images/p3.jpg">
    <img src="images/p4.jpg">
</div>

cycle-slideshow  这个class 告诉插件开始运行我们的效果。

上面的设置正确后，效果就有了。

发现cycle2真的更简单了。

插件主页：http://www.malsup.com/jquery/cycle2/

demo地址：http://www.malsup.com/jquery/cycle2/demo/basic.php

http://blog.163.com/xz551@126/blog/static/821257972012101541835491/

转载于:https://my.oschina.net/ajian2014/blog/311713