Swiper.js Initial involvement

To do a mobile phone-side carousel, studied a bit of swiper.js

Chinese website: http://www.swiper.com.cn/

English website: http://www.idangero.us/swiper/

Record the code:

var myswiper = new Swiper ('. Swiper-container ', {
Mode: ' Vertical ',//vertical direction of sliding direction
Pagination: '. Pagination ',
Onslideprev:function (Swiper) {
sdragdirection = ' down ';
},
Onslidenext:function (Swiper) {
sdragdirection = ' up ';
},
Onslidereset:function (Swiper) {
var iNum = 0;
if (sdragdirection = = ' down ') {
Console.log (' drag Down ');//ajax get data from the previous day
INum = 2;
sdragdirection = ' up ';
}
else if (sdragdirection = = ' up ') {
Console.log (' drag up ');//ajax gets the day after the data
INum = 0;
sdragdirection = ' down ';
}
var newSlide1 = myswiper.createslide (' <p> This is a new slide1</p> ', ' swiper-slide blue-slide ', ' div ');//Create Slide
Newslide1.append (); Add to Slides's last
var newSlide2 = myswiper.createslide (' <p> This is a new slide2</p> ', ' swiper-slide blue-slide ', ' div ');
Newslide2.append (); Add to Slides's last
var newSlide3 = myswiper.createslide (' <p> This is a new slide3</p> ', ' swiper-slide blue-slide ', ' div ');
Newslide3.append (); Add to Slides's last
var ilength = 3;
for (Var i=0;i<ilength;i++) {
Myswiper.removeslide (0); Delete the first three slide
}
Myswiper.swipeto (INum, 1, false);
}
})

This is the main use of

Onslideprev:function (Swiper) {} Up one swipe trigger event
Onslidenext:function (swiper) {} down a sliding trigger event
Onslidereset:function (swiper) {} slider does not reach a trigger event that is the last or the next one does not exist, triggering an event

Swiper.js Initial involvement