swiper 页码器问题

查看数: 5668 | 评论数: 5 | 收藏 0
关灯 | 提示:支持键盘翻页<-左 右->
    组图打开中,请稍候......
发布时间: 2015-4-30 17:41

正文摘要:

本帖最后由 小小志 于 2015-4-30 17:49 编辑 如图所示,现在的情况是,我在一个页面可能有多个swiper,每个swiper都需要有分页器,那么问题来了,当页面中所有swiper都初始化后,分页器只作用于最后一个初始化的s ...

回复

小七 发表于 2015-5-13 19:34:05
var doArtSwiper = function(e,i){
  var artOption = {
    pagination: '#swiper-pagination' + i,
    loop: true
  };
  e = new Swiper('#' + e, artOption);
};
$('.qir').each(function(){
  doArtSwiper($(this).attr('id'),$(this).attr('id').charAt($(this).attr('id').length-1));
});
忘记优化了
小七 发表于 2015-5-13 19:29:27
var doArtSwiper = function(e,i){
  var hh = '#swiper-pagination' + i;
  console.log(hh);
  var artOption = {
    pagination: hh,
    loop: true
  };
  artOption = Math.abs(window.orientation) === 90 ? $.extend({
    spaceBetween: 8,
    slidesPerView: 2,
    centeredSlides: true
  }, artOption) : artOption;
  e = new Swiper('#' + e, artOption);
};
$('.qir').each(function(){
  var e = $(this).attr('id');
  doArtSwiper(e,e.charAt(e.length-1));
});
搞定,可参考上面的代码,往里面传值
小七 发表于 2015-5-13 18:01:34
少量应该怎么写啊,谢谢
小小志 发表于 2015-5-4 13:31:25
admin 发表于 2015-4-30 19:25
试一下每个分页器用不同的标签

少量确定的swipe可以用这种方法,如果swipe的个数不确定的话就难了
admin 发表于 2015-4-30 19:25:31
试一下每个分页器用不同的标签

  1. <script language="javascript">
  2. var mySwiper = new Swiper('#swiper-container1',{
  3. pagination : '#swiper-pagination1',
  4. })

  5. var mySwiper2 = new Swiper('#swiper-container2',{
  6. pagination : '#swiper-pagination2',
  7. })
  8. </script>
复制代码

Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

GMT+8, 2024-11-22 06:24 , Processed in 0.061626 second(s), 31 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表