如何使用swiper滑块与jquery选项卡？

我试图使用idangero swiper与jquery选项卡我得到我想要的所有结果，除了pagination.slider分页只显示一个项目符号。使用单选项卡时工作正常，但我不知道如何应用swiper时两个或更多选项卡是必需的。例如，我的代码和jsfiddle链接。 http://jsfiddle.net/Rzeiwald/wunw9enL/3/ – http://jsfiddle.net/Rzeiwald/m61qfck1/感谢您的时间HTML

 
 
 
op
 
oop
 
 
  
 
 
 
 
 
 
 
 
 
 
 
 
  
  
 
 
 
 
  
 
 
 
 
  
  
 
 
 
 
  

使用Javascript

 var swiper = new Swiper('.swiper-container', { pagination: '.swiper-pagination', nextButton: '.swiper-button-next', prevButton: '.swiper-button-prev', slidesPerView: 3, centeredSlides: false, paginationClickable: true, autoplay: 2500, spaceBetween: 15, }); 

Answer 1

1-根据swiper初始化 ，你必须在$(document).ready或body结尾或window.onload里面调用你的脚本。

2-你必须在.tabs()之后调用.tabs() 。 我认为swiper试图应用于隐藏或没有宽度/高度等的元素。

的jsfiddle

 $(document).ready( function () { var swiper = new Swiper('.swiper-container', { pagination: '.swiper-pagination', nextButton: '.swiper-button-next', prevButton: '.swiper-button-prev', slidesPerView: 3, centeredSlides: false, paginationClickable: true, autoplay: 2500, spaceBetween: 15, }); $('#tabs').tabs(); });