Swiper2中文api - Swiper2|Swiper中文网

配置选项

Swiper2.x的全部配置选项、方法、函数

Swiper初始化: new Swiper(container,options)

Basic（Swiper基础选项）: autoplay:0; speed:300; eventTarget:wrapper; autoplayDisableOnInteraction:true; autoplayStopOnLast:false; mode:horizontal; loop:false; loopAdditionalSlides:0; slidesPerView:1; loopedSlides:1; slidesPerViewFit:true; slidesPerGroup:1; calculateHeight:false; roundLengths:false; cssWidthAndHeight:false; updateOnImagesReady:true; releaseFormElements:true; watchActiveIndex:false; visibilityFullFit:false; autoResize:true; resizeReInit:false; DOMAnimation:true; resistance:true; noSwiping:false; preventLinks:true; preventLinksPropagation:false; initialSlide:0; useCSS3Transforms:true

Free Mode （free模式/抵抗反弹）: freeMode:false; freeModeFluid:false; scrollContainer:false; momentumRatio:1; momentumBounce:true; momentumBounceRatio:1

Slides offset (slides位移选项): centeredSlides:false; offsetPxBefore:0; offsetPxAfter:0; offsetSlidesBefore:0; offsetSlidesAfter:0

Touch/mouse interactions (触发Swiper选项): touchRatio:1; simulateTouch:true; onlyExternal:false; followFinger:true; grabCursor:false; shortSwipes:true; longSwipesRatio:0.5; moveStartThreshold:false; swipeToNext:true; swipeToPrev:true

Navigation (鼠标、键盘控制选项): keyboardControl:false; mousewheelControl:false; mousewheelControlForceToAxis:false

Pagination（分页器选项）: pagination:; paginationClickable:false; paginationAsRange:true; createPagination:true

Namespace （命名空间）: wrapperClass:swiper-wrapper; slideClass:swiper-slide; slideActiveClass:swiper-slide-active; slideVisibleClass:swiper-slide-visible; slideElement:div; noSwipingClass:swiper-no-swiping; paginationElement:span; paginationElementClass:swiper-pagination-switch; paginationActiveClass:swiper-active-switch; paginationVisibleClass:swiper-visible-switch

Callbacks （回调函数）: addCallback:function(){...}; fireCallback:function(){...}; removeCallbacks:function(){...}; queueStartCallbacks:function(){...}; queueEndCallbacks:function(){...}; onFirstInit:function(){...}; onInit:function(){...}; onSwiperCreated:function(){...}; onTouchStart:function(){...}; onTouchMove:function(){...}; onTouchEnd:function(){...}; onSlideReset:function(){...}; onSlideChangeStart:function(){...}; onSlideChangeEnd:function(){...}; onSlideNext:function(){...}; onSlidePrev:function(){...}; onSlideClick:function(){...}; onSlideTouch:function(){...}; onImagesReady:function(){...}; onMomentumBounce:function(){...}; onAutoplayStop:function(){...}; onAutoplayStart:function(){...}; onResistanceBefore:function(){...}; onResistanceAfter:function(){...}; onSetWrapperTransition:function(){...}; onSetWrapperTransform:function(){...}

Function （Swiper函数）: disableMousewheelControl(); enableMousewheelControl(); enableKeyboardControl(); disableKeyboardControl(); swipeNext(); swipePrev(); swipeTo(index,speed,runCallbacks); activeSlide(); startAutoplay(); stopAutoplay(); destroy(removeResizeEvent); resizeFix(); reInit(); getWrapperTranslate(axis); setWrapperTranslate(x,y,z); wrapperTransitionEnd(); setTransform(instance,Transform); setTransition(instance,duration)

Method （Swiper方法）: browser.ie10; browser.ie8; support.touch; support.transforms; support.transforms3d; support.transitions; clickedSlideIndex; clickedSlide; activeIndex; activeLoopIndex; activeLoaderIndex; previousIndex; width; height; isTouched; positions; touches; params

增加、删除Slide: createSlide(html,slideClassList,element); slides; appendSlide(HTML,slideClassList,element); appendSlide(slideInstance); prependSlide(HTML,slideClassList,element); prependSlide(slideInstance); insertSlideAfter(index,HTML,slideClassList,element); insertSlideAfter(index,slideInstance); removeSlide(index); removeLastSlide(); removeAllSlides(); getSlide(index); getLastSlide(); getFirstSlide()

控制slide: append(); prepend(); remove(); getWidth(); getHeight(); getOffset(); insertAfter(index); clone()

设置slide: html(innerHTML); index(); isActive(); setData(name,value); getData(name); data(name,value); data(name)

Swiper 3D flow插件参数: rotate; stretch; depth; modifier; shadows

Swiper Scrollbar插件参数: container; draggable; hide; snapOnRelease; dragSize; onScrollbarDrag

Swiper基本结构

名词解释

名词	翻译	描述
Swiper	滑动、切换	整个滑动对象，有时特指滑块释放后仍然正向移动直到贴合边缘的过程
container	容器	Swiper的容器，里面包括滑动块（slide）的集合（wrapper)、分页器(pagination)、前进按钮等
wrapper	包含	触控的对象，可触摸区域，移动的块的集合
slider	滑块	切换的块中的一个，可以是一段文字、一张图片或者一段html代码
pagination	分页	指示slide的数量和当前活动的slide
active	活动的，激活的	默认可视区域内最左边的slide是活动的，其他的是非活动的
callback	回调函数	在某些情况下触发