diff --git a/src/modules/carousel.js b/src/modules/carousel.js
index 765abe93..e58637f7 100644
--- a/src/modules/carousel.js
+++ b/src/modules/carousel.js
@@ -12,50 +12,61 @@ layui.define(['jquery', 'lay'], function(exports){
var hint = layui.hint();
var device = layui.device();
- //外部接口
+ // 外部接口
var carousel = {
- config: {} //全局配置项
+ config: {}, // 全局配置项
- //设置全局项
- ,set: function(options){
+ // 设置全局项
+ set: function(options){
var that = this;
that.config = $.extend({}, that.config, options);
return that;
- }
+ },
- //事件
- ,on: function(events, callback){
+ // 事件
+ on: function(events, callback){
return layui.onevent.call(this, MOD_NAME, events, callback);
}
- }
+ };
- //字符常量
- ,MOD_NAME = 'carousel', ELEM = '.layui-carousel', THIS = 'layui-this', SHOW = 'layui-show', HIDE = 'layui-hide', DISABLED = 'layui-disabled'
+ // 字符常量
+ var MOD_NAME = 'carousel';
+ var ELEM = '.layui-carousel';
+ var THIS = 'layui-this';
+ var SHOW = 'layui-show';
+ var HIDE = 'layui-hide';
+ var DISABLED = 'layui-disabled'
- ,ELEM_ITEM = '>*[carousel-item]>*', ELEM_LEFT = 'layui-carousel-left', ELEM_RIGHT = 'layui-carousel-right', ELEM_PREV = 'layui-carousel-prev', ELEM_NEXT = 'layui-carousel-next', ELEM_ARROW = 'layui-carousel-arrow', ELEM_IND = 'layui-carousel-ind'
+ var ELEM_ITEM = '>*[carousel-item]>*';
+ var ELEM_LEFT = 'layui-carousel-left';
+ var ELEM_RIGHT = 'layui-carousel-right';
+ var ELEM_PREV = 'layui-carousel-prev';
+ var ELEM_NEXT = 'layui-carousel-next';
+ var ELEM_ARROW = 'layui-carousel-arrow';
+ var ELEM_IND = 'layui-carousel-ind';
- //构造器
- ,Class = function(options){
+ // 构造器
+ var Class = function(options){
var that = this;
that.config = $.extend({}, that.config, carousel.config, options);
that.render();
};
- //默认配置
+ // 默认配置
Class.prototype.config = {
- width: '600px'
- ,height: '280px'
- ,full: false //是否全屏
- ,arrow: 'hover' //切换箭头默认显示状态：hover/always/none
- ,indicator: 'inside' //指示器位置：inside/outside/none
- ,autoplay: true //是否自动切换
- ,interval: 3000 //自动切换的时间间隔，不能低于800ms
- ,anim: '' //动画类型：default/updown/fade
- ,trigger: 'click' //指示器的触发方式：click/hover
- ,index: 0 //初始开始的索引
+ width: '600px',
+ height: '280px',
+ full: false, // 是否全屏
+ arrow: 'hover', // 切换箭头默认显示状态：hover/always/none
+ indicator: 'inside', // 指示器位置：inside/outside/none
+ autoplay: true, // 是否自动切换
+ interval: 3000, // 自动切换的时间间隔，不能低于800ms
+ anim: '', // 动画类型：default/updown/fade
+ trigger: 'click', // 指示器的触发方式：click/hover
+ index: 0 // 初始开始的索引
};
- //轮播渲染
+ // 轮播渲染
Class.prototype.render = function(){
var that = this;
var options = that.config;
@@ -82,35 +93,36 @@ layui.define(['jquery', 'lay'], function(exports){
if(options.index >= that.elemItem.length) options.index = that.elemItem.length - 1;
if(options.interval < 800) options.interval = 800;
- //是否全屏模式
+ // 是否全屏模式
if(options.full){
options.elem.css({
- position: 'fixed'
- ,width: '100%'
- ,height: '100%'
- ,zIndex: 9999
+ position: 'fixed',
+ width: '100%',
+ height: '100%',
+ zIndex: 9999
});
} else {
options.elem.css({
- width: options.width
- ,height: options.height
+ width: options.width,
+ height: options.height
});
}
options.elem.attr('lay-anim', options.anim);
- //初始焦点状态
+ // 初始焦点状态
that.elemItem.eq(options.index).addClass(THIS);
- //指示器等动作
+ // 指示器等动作
if(that.elemItem.length <= 1) return;
+
that.indicator();
that.arrow();
that.autoplay();
that.events();
};
- //重置轮播
+ // 重置轮播
Class.prototype.reload = function(options){
var that = this;
clearInterval(that.timer);
@@ -118,62 +130,64 @@ layui.define(['jquery', 'lay'], function(exports){
that.render();
};
- //获取上一个等待条目的索引
+ // 获取上一个等待条目的索引
Class.prototype.prevIndex = function(){
- var that = this
- ,options = that.config;
-
+ var that = this;
+ var options = that.config;
var prevIndex = options.index - 1;
+
if(prevIndex < 0){
prevIndex = that.elemItem.length - 1;
}
+
return prevIndex;
};
- //获取下一个等待条目的索引
+ // 获取下一个等待条目的索引
Class.prototype.nextIndex = function(){
- var that = this
- ,options = that.config;
-
+ var that = this;
+ var options = that.config;
var nextIndex = options.index + 1;
+
if(nextIndex >= that.elemItem.length){
nextIndex = 0;
}
+
return nextIndex;
};
- //索引递增
+ // 索引递增
Class.prototype.addIndex = function(num){
- var that = this
- ,options = that.config;
+ var that = this;
+ var options = that.config;
num = num || 1;
options.index = options.index + num;
- //index不能超过轮播总数量
+ // index 不能超过轮播总数量
if(options.index >= that.elemItem.length){
options.index = 0;
}
};
- //索引递减
+ // 索引递减
Class.prototype.subIndex = function(num){
- var that = this
- ,options = that.config;
+ var that = this;
+ var options = that.config;
num = num || 1;
options.index = options.index - num;
- //index不能超过轮播总数量
+ // index 不能超过轮播总数量
if(options.index < 0){
options.index = that.elemItem.length - 1;
}
};
- //自动轮播
+ // 自动轮播
Class.prototype.autoplay = function(){
- var that = this
- ,options = that.config;
+ var that = this;
+ var options = that.config;
if(!options.autoplay) return;
clearInterval(that.timer);
@@ -183,30 +197,30 @@ layui.define(['jquery', 'lay'], function(exports){
}, options.interval);
};
- //箭头
+ // 箭头
Class.prototype.arrow = function(){
- var that = this
- ,options = that.config;
+ var that = this;
+ var options = that.config;
- //模板
+ // 模板
var tplArrow = $([
- ''
- ,''
+ '',
+ ''
].join(''));
- //预设基础属性
+ // 预设基础属性
options.elem.attr('lay-arrow', options.arrow);
- //避免重复插入
+ // 避免重复插入
if(options.elem.find('.'+ELEM_ARROW)[0]){
options.elem.find('.'+ELEM_ARROW).remove();
}
options.elem.append(tplArrow);
- //事件
+ // 事件
tplArrow.on('click', function(){
- var othis = $(this)
- ,type = othis.attr('lay-type')
+ var othis = $(this);
+ var type = othis.attr('lay-type')
that.slide(type);
});
};
@@ -223,26 +237,26 @@ layui.define(['jquery', 'lay'], function(exports){
}
}
- //指示器
+ // 指示器
Class.prototype.indicator = function(){
- var that = this
- ,options = that.config;
+ var that = this;
+ var options = that.config;
- //模板
- var tplInd = that.elemInd = $([''
- ,function(){
+ // 模板
+ var tplInd = that.elemInd = $(['',
+ function(){
var li = [];
layui.each(that.elemItem, function(index){
li.push('');
});
return li.join('');
- }()
- ,'