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


Posted in Javascript onApril 12, 2015

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

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

使用方法:

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   立即下载

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

Javascript 相关文章推荐
JavaScript 事件系统
Jul 22 Javascript
初窥JQuery(二) 事件机制(1)
Nov 25 Javascript
jquery 设置style:display的方法
Jan 29 Javascript
利用jQuery中的ajax分页实现代码
Feb 25 Javascript
jQuery实现的瀑布流加载效果示例
Sep 13 Javascript
Vue中父组件向子组件通信的方法
Jul 11 Javascript
JavaScript实现的简单加密解密操作示例
Jun 01 Javascript
vue.js 中使用(...)运算符报错的解决方法
Aug 09 Javascript
全面解析vue router 基本使用(动态路由,嵌套路由)
Sep 02 Javascript
BootStrap table实现表格行拖拽效果
Dec 01 Javascript
JS面向对象之单选框实现
Jan 17 Javascript
Vue使用axios引起的后台session不同操作
Aug 14 Javascript
jQuery表单美化插件jqTransform使用详解
Apr 12 #Javascript
jQuery插件PageSlide实现左右侧栏导航菜单
Apr 12 #Javascript
jQuery插件StickUp实现网页导航置顶
Apr 12 #Javascript
JavaScript 面向对象与原型
Apr 10 #Javascript
javascript基本包装类型介绍
Apr 10 #Javascript
javascript表格隔行变色加鼠标移入移出及点击效果的方法
Apr 10 #Javascript
js改变embed标签src值的方法
Apr 10 #Javascript
You might like
关于我转生变成史莱姆这档事:第二季PV上线,萌王2021年回归
2020/05/06 日漫
php小型企业库存管理系统的设计与实现代码
2011/05/16 PHP
Codeigniter实现处理用户登录验证后的URL跳转
2014/06/12 PHP
PHP计算日期相差天数实例分析
2016/02/23 PHP
关于IE浏览器以及Firefox下的javascript冒泡事件的响应层级
2010/10/14 Javascript
function foo的原型与prototype属性解惑
2010/11/19 Javascript
菜鸟javascript基础整理1
2010/12/06 Javascript
javascript模版引擎-tmpl的bug修复与性能优化分析
2011/10/23 Javascript
基于jquery完美拖拽,可返回拖动轨迹
2012/03/29 Javascript
jquery 删除cookie失效的解决方法
2013/11/12 Javascript
js支持键盘控制的左右切换立体式图片轮播效果代码分享
2015/08/26 Javascript
JavaScript中的时间处理小结
2016/02/24 Javascript
Javascript将数字转化成为货币格式字符串
2016/06/22 Javascript
封装获取dom元素的简单实例
2016/07/08 Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
2016/12/26 Javascript
详解vue.js2.0父组件点击触发子组件方法
2017/05/10 Javascript
JavaScript图片处理与合成总结
2018/03/04 Javascript
详解vuex的简单使用
2018/03/12 Javascript
vue中的过滤器实例代码详解
2019/06/06 Javascript
layUI实现三级导航菜单效果
2019/07/26 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
2019/12/06 Javascript
实例讲解Python中global语句下全局变量的值的修改
2016/06/16 Python
python虚拟环境virtualenv的使用教程
2017/10/20 Python
python机器学习之神经网络(一)
2017/12/20 Python
树莓派使用USB摄像头和motion实现监控
2019/06/22 Python
python实现统计代码行数的小工具
2019/09/19 Python
django ORM之values和annotate使用详解
2020/05/19 Python
加拿大留学自荐信
2014/01/28 职场文书
小学生家长评语大全
2014/02/10 职场文书
暑期培训随笔感言
2014/03/10 职场文书
公务员培的训心得体会
2014/09/01 职场文书
护士医德医风自我评价
2014/09/15 职场文书
参观邀请函范文
2015/02/02 职场文书
2015年结对帮扶工作总结
2015/05/04 职场文书
SpringBoot中HttpSessionListener的简单使用方式
2022/03/17 Java/Android
golang三种设计模式之简单工厂、方法工厂和抽象工厂
2022/04/10 Golang