zoukankan      html  css  js  c++  java
  • Swiper 滑动

    1.http://www.swiper.com.cn/download/  下载Swiper.JS  Swiper.CSS

    2.引入项目,添加html

      <div class="content">
                <div class="swiper-container" id="swiper-container1">
                    <div class="swiper-wrapper" id="orderState">
                         <div class="swiper-slide" title="1">审核通过</div>
                        <div class="swiper-slide" title="2">审核未通过</div>
                     </div>
                </div>

    </div>


                <div class="swiper-container" id="swiper-container2">
                    <div class="swiper-wrapper">
                  
           <div class="swiper-slide">@*审核通过*@
                            <div id="AuditthroughDt" data-type="1" class="allOrder  yscroll">
                                <div id="ADiv">
                               
                                </div>
                           </div>
                        </div>

          <div class="swiper-slide">@*审核未通过*@
                            <div id="AuditthroughDt" data-type="2" class="allOrder  yscroll">
                                <div id="BDIV">
                           
                                </div>
                           </div>
                        </div>
                             
                    
                     </div>
                </div>

    3.调用

         //左右滑动
                var mySwiper1 = new Swiper('#swiper-container1', {
                    direction: 'horizontal',
                    loop: false,
                    slidesPerView: 1,//显示几个
                    watchSlidesProgress: true,
                    watchSlidesVisibility: true,
                    onTap: function () {

          //到那个选项卡  
                        mySwiper2.slideTo(mySwiper1.clickedIndex)
                    }

                })

  • 相关阅读:
    Windows操作系统堆和栈的区别
    API1——CppSparseFile
    typedef struct 用法详解和用法小结
    开发人员应该用好的一些网站
    Windows编程中的堆管理
    在VC中编译、运行程序的小知识点
    Script:列出数据库中5%以上链式行的表
    解决Linux上11g的ORA00845错误
    Oracle内部错误:ORA00600[kfioTranslateIO03]一例
    Oracle内部错误:ORA00600[2608]一例
  • 原文地址:https://www.cnblogs.com/j2ee-web-01/p/7286105.html
Copyright © 2011-2022 走看看