requirejs javascript对象
http://travel.ifeng.com/
<script> requirejs.config({ paths:{ "jquery#1.8.1" : "http://y1.ifengimg.com/fe/jQuery/jquery-1.8.1.min", "swiper":"http://y0.ifengimg.com/a/2015/1126/syj/lvyou/swiper-new" }, waitSeconds: 20,shim: {}}); </script>
define("swiper",["jquery#1.8.1"],function ($) {
var swiper = {
init:function(initData){
this.index = 1;//记录显示的图片的index
this.timer = null;//定时器
this.initDom(initData);
//循环模式
if(initData.auto){
this.bigpicInterval();
};
if(initData.device == "mobile"){
this.initMobielEvent(initData);
}else{
this.initEvent(initData);
};
}
};
swiper.init.prototype={
initDom:function(initData){
this.container = $('.'+initData.container);
this.swiper_wrapper = this.container.find('.swiper_wrapper');
var swiper = this.container.find('.swiper');
var length = swiper.length;
this.total = length//记录总共的滑动张数
//hover操作翻页dom
this.handler = initData.handlerClassname?this.container.find('.'+initData.handlerClassname):"";
//翻页对应显示的内容
this.contentInfo = initData.contentClassname?this.container.find('.'+initData.contentClassname):"";
//左右翻页按钮
if(initData.buttonId){
this.prev = this.container.find('#'+initData.buttonId[0]);
this.next = this.container.find('#'+initData.buttonId[1]);
};
if(initData.loop){
//循环模式需要给前后各添加一张幻灯
swiper.eq(0).clone(true).appendTo(this.swiper_wrapper);
swiper.eq(length-1).clone(true).insertBefore(swiper.eq(0));
length = length+2;
};
//修改父元素的宽度
this.width = swiper.eq(0).width();
var widthTotal = this.width*length;
var _this = this;
this.swiper_wrapper.width(widthTotal);
if(initData.loop){
this.swiper_wrapper.css('margin-left',-this.width);
};
},
initEvent:function(initData){
var swiper = this.container.find('.swiper');
var _this = this;
function closeInterval(){
//关闭定时器
clearInterval(_this.timer);
if(_this.prev){
_this.prev.show();
_this.next.show();
}
}
function openInterval(){
//开启定时器
_this.bigpicInterval();
if(_this.prev){
_this.prev.hide();
_this.next.hide();
}
}
if(initData.auto){
swiper.hover(function(){
closeInterval();
},function(){
openInterval()
});
_this.next.hover(function(){
closeInterval();
},function(){
openInterval()
});
_this.prev.hover(function(){
closeInterval();
},function(){
openInterval()
});
};
_this.next.on('click',function(){
clearInterval(_this.timer);
_this.swiper_wrapper.stop(true,true);
_this.index = _this.index+1;
_this.bigpicSwiper();
});
_this.prev.on('click',function(){
clearInterval(_this.timer);
_this.swiper_wrapper.stop(true,true);
_this.index = _this.index-1;
_this.bigpicSwiper();
});
if(_this.handler){
_this.handler.find('li').hover(function() {
clearInterval(_this.timer);
_this.swiper_wrapper.stop(true,true);
_this.index = $(this).index()+1;
_this.bigpicSwiper();
return false;
}, function() {
openInterval();
return false;
});
};
},
bigpicInterval:function(){
var _this = this;
clearInterval(this.timer);
_this.timer = setInterval(function(){
_this.index = _this.index+1;
_this.bigpicSwiper();
},8000);
},
bigpicSwiper:function(){
var width = this.width;
var index = this.index;
var _this = this;
if(index > this.total){
this.swiper_wrapper.animate({marginLeft:-width*index+'px'},function(){
$(this).css('margin-left',-width);
_this.index = index = 1;
update();
return false;
});
}else if(index < 1){
this.swiper_wrapper.animate({marginLeft:-width*index+'px'},function(){
$(this).css('margin-left',-_this.total*width);
_this.index = index = _this.total;
update();
return false;
});
}else{
this.swiper_wrapper.animate({marginLeft:-width*index+'px'},function(){
update();
return false;
});
};
function update(){
//显示对应内容
if(_this.contentInfo){
_this.contentInfo.hide();
_this.contentInfo.eq(index-1).show();
};
//操作对应的handler
if(_this.handler){
var li = _this.handler.find('li');
li.removeClass('current');
li.eq(index-1).addClass('current');
}
}
},
initMobielEvent:function(initData){
var _this = this;
var swiper = this.container.find('.swiper');
var container = this.swiper_wrapper;
var startX,startY,moveX = 0;
var initLeft;
swiper.on('touchstart',function(){
//关闭定时器
clearInterval(_this.timer);
//获取marginleft的值
initLeft = parseInt(container.css('marginLeft'));
startMove();
return false;
});
swiper.on('touchmove',function(){
var location = touchMove();
moveX = location.x;
container.css('marginLeft',moveX+initLeft+'px');
return false;
});
swiper.on('touchend',function(){
if(moveX < -10 || moveX > 10){
_this.swiper_wrapper.stop(true,true);
if(moveX < -10){
//向右滑动
_this.index = _this.index+1;
}else{
//向左滑动
_this.index = _this.index-1;
};
_this.bigpicSwiper();
}else{
//tap事件
var href = $(this).find('a').attr('href');
window.open(href);
}
//初始化
if(initData.auto){
//开启定时器
_this.bigpicInterval();
}
moveX = 0;
return false;
});
_this.next.on('click',function(){
clearInterval(_this.timer);
_this.swiper_wrapper.stop(true,true);
_this.index = _this.index+1;
_this.bigpicSwiper();
});
_this.prev.on('click',function(){
clearInterval(_this.timer);
_this.swiper_wrapper.stop(true,true);
_this.index = _this.index-1;
_this.bigpicSwiper();
});
function startMove(){
var touch = event.touches[0];
startY = touch.pageY;
startX = touch.pageX;
};
function touchMove(){
var touch = event.touches[0];
var x = touch.pageX - startX;
var y = touch.pageY - startY;
var location = {
x: x,
y: y
};
return location;
}
}
}
return swiper;
});

浙公网安备 33010602011771号