jQuery插件slick实现响应式移动端幻灯片图片切换特效

2019-11-20 12:43:10

字体：大中小

来源：转载

供稿：网友

jQuery响应式手机端移动端幻灯片图片切换特效插件slick，基于jQuery，功能非常强大，支持左右按钮切换、支持圆点切换、支持自定义切换数量，支持自定义切换速度、支持图片预加载、支持自动播放定义，效果非常的不错，众多的参数自定义支持，觉得可以的可以参考他们的参数配置，还是值得学习使用的。

使用方法：

1.加载插件和jQuery

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script type="text/javascript" src="slick/slick.js"></script> <link rel="stylesheet" type="text/css" href="slick/slick.css"/>

2.HTML内容

<div class="slider fade"> <div><div class="image"><img src="img/fonz1.png"/></div></div> <div><div class="image"><img src="img/fonz2.png"/></div></div> <div><div class="image"><img src="img/fonz3.png"/></div></div> </div>

3.函数调用

<script type="text/javascript"> $(document).ready(function() {   $('.fade').slick({     dots: true,     infinite: true,     speed: 500,     fade: true,     slide: 'div',     cssEase: 'linear'   }); }); </script>

查看DEMO 立即下载

以上所述就是本文的全部内容了，希望大家能够喜欢。

上一篇：纯JS实现旋转图片3D展示效果

下一篇：jQuery表单美化插件jqTransform使用详解