zoukankan      html  css  js  c++  java
  • 遍历实例化swiper


    var list = $('.p04-s2 li');
    list.each(function (index) {
    new Swiper ($(this).find('.swiper-container'), {
    spaceBetween: 10,
    slidesPerView : 3,
    watchOverflow: true,
    centeredSlides : true,
    loop: true,
    breakpoints: {
    1500: {
    slidesPerView: 2
    },
    1200: {
    slidesPerView: 1
    }
    },
    pagination: {
    el: $(this).find('.swiper-pagination'),
    clickable :true
    },
    navigation: {
    prevEl: $(this).find('.prev-btn'),
    nextEl: $(this).find('.next-btn'),
    }
    });
    });

    如果是tab下遍历swiper

     
            function initSwiper($element) {
                new Swiper ($element.find('.swiper-container'), {
                    spaceBetween: 20,
                    slidesPerView : s1PerNum,
                    watchOverflow: true,
                    loopedSlides: 5,
                    loop: isLoop($element.find('.swiper-slide'), s1PerNum),
                    breakpoints: { 
                        1366: {
                            slidesPerView: 3
                        },
                        960: {
                            slidesPerView: 2
                        },
                        540: {
                            slidesPerView: 1
                        }
                    },
                    navigation: {
                        prevEl: $element.find('.prev'),
                        nextEl: $element.find('.next')
                    }
                }); 
            }
     
            $('.tab li').click(function() {
                $('.tab li').removeClass('current');
                $(this).addClass('current');
                var clickIndex = $(this).index();
                $currentLI = $('.text-slider > li').removeClass('active').eq(clickIndex).addClass('active');
                if (!$currentLI.data('initState')) {
                    initSwiper($currentLI);
                    $currentLI.data('initState', true);
                }
            }).eq(0).trigger('click'); 
  • 相关阅读:
    asp.net 曲线图
    asp.net 图片下载
    使用a标签删除进行提示
    asp.net 后台获取input的值
    asp.net Excel数据导入到数据库中
    asp.net DataSet数据导出到Excel中
    select top 所有
    asp.net 上一条和下一条记录的显示
    日期相减函数
    mybatis mapper学习1(补充)-mapper.xml映射文件生成补充
  • 原文地址:https://www.cnblogs.com/gduf/p/12021039.html
Copyright © 2011-2022 走看看