jQuery Cycle Plugin && jQuery FlexSlider
来源:互联网 发布:摇粒绒 静电 知乎 编辑:程序博客网 时间:2024/03/29 20:15
//适用于全屏复古型
jQuery FlexSlider
$('.flexslider').flexslider({
animation: "fade", //图片变换方式:淡入淡出或者滑动slideDirection: "horizontal", //图片设置为滑动式时的滑动方向:左右或者上下
slideshow: true, //载入页面时,是否自动播放
slideshowSpeed: 7000, //自动播放速度毫秒
animationDuration: 600, //内容切换时间
touch: //是否支持触摸滑动
directionNav: true, //是否显示左右控制按钮
controlNav: true, //是否显示控制菜单
keyboardNav: true, //键盘左右方向键控制图片滑动
mousewheel: false, //鼠标滚轮控制制图片滑动
minItems:1 //一次最少展示滑动内容的单元个数
maxItems:0 //一次最多展示滑动内容的单元个数
move:0 //一次滑动的单元个数
prevText: "Previous", //String: 上一项的文字
nextText: "Next", //String: 下一项的文字
pausePlay: false, //Boolean: 是否显示播放暂停按钮
pauseText: 'Pause', //String: 暂停文字
playText: 'Play', //String: 播放文字
randomize: false, //Boolean: 是否随机幻灯片
slideToStart: 0, //Integer: 初始化第一次显示图片位置
animationLoop: true, //是否循环滚动
pauseOnAction: true, //Boolean: Pause the slideshow when interacting with control elements, highly recommended.
pauseOnHover: false, //鼠标滑向滚动内容时,是否暂停滚动
pauseOnHover: false, //鼠标糊上去是否暂停
controlsContainer: "", //Selector: be taken.
manualControls: "", //自定义控制导航
manualControlEvent:"", //String:自定义导航控制触发事件:默认是click,可以设定hover
start: function(){}, //加载第一页触发
before: function(){}, //每个滚动动画开始时异步触发
after: function(){}, //每个滚动动画结束时触发
end: function(){} //滚动到最后一页时异步触发
});
//适用带点特效的轮播
jQuery Cycle Plugin
官方demo http://jquery.malsup.com/cycle/
$(id).cycle({
fx : 'fade',
speed : 700,
timeout : 3000,
pager : '.promotions .ss_paging',
next:'#cl2',
prev:'#cl1',
pause:true,
before : function(currSlideElement, nextSlideElement) {
}
});
fx:'fade' 值:字符串,作用:选择特效.切换效果是它的重头戏,我统计过,jquery.cycle.
speed:300 值:正整数,作用:图片渐变效果持续时间
timeout:3000 值:正整数,作用:切换间隔时间
pause:1 值:布尔值,作用:决定鼠标指上去时是否暂停
next:” 值:字符串,实际是一个jquery对象,如’#s1′;作用:指定触发变动到下一张事件的元素
prev:’‘ 值:同next;作用:指定触发变动到上一张事件的元素
pager: 值:一个jquery对象;作用:指定页码元素,如多图片滚动时那个数字序号条
pagerEvent:’mouseover’ 值:鼠标事件;作用:指定页码触发事件
pauseOnPagerHover:true 值:布尔值;作用:为true时,鼠标指向页码区时暂停切换
before: 值:函数;作用:指定变动开始前调用的函数
after: 值:函数;作用:指定变动结束后调用的函数
- jQuery Cycle Plugin && jQuery FlexSlider
- jQuery Cycle Plugin
- jQuery FlexSlider插件的详细设置参数
- 关于jquery.flexslider-min.js插件
- jQuery FlexSlider滑动插件的使用
- jquery plugin
- jquery plugin
- jQuery 对话框 jQuery.plugin
- jQuery / jQuery mvc plugin
- 增强版内容轮播器(jQuery.flexslider.js的应用)
- 基于jQuery的内容滚动插件flexSlider.js
- jquery.flexslider-min.js实现banner轮播图效果
- jQuery FlexSlider插件一些使用上的小tips
- jQuery Form Plugin
- jQuery - plugin插件 - Cookie
- jQuery BlockUI Plugin
- Jquery for table plugin
- Jquery plugin 大全
- lambda expressions are not supported at this language level
- 学习Python的14张思维导图
- rhel7和centos7的lamp环境搭建
- [iOS] TabBarController push后隐藏TabBar
- ios 9 10 11 air mirror 交互协议
- jQuery Cycle Plugin && jQuery FlexSlider
- STC15系列单片机-I/O口小结
- iOS_SDK_API_使用说明
- MFC透明贴图问题
- Java 虚拟机学习( 2 ):垃圾收集算法
- 计数排序(python)
- 【芝麻信用对接】欺诈信息验证
- Guitar Pro删除的一个完整小节的操作步骤解析
- [2-sat]codeforces 875 C——National Property