zoukankan      html  css  js  c++  java
  • swiper中的双向控制器不生效问题

    <!-- Swiper -->
    <div class="swiper mySwiper1">
    <div class="swiper-wrapper">
    <div class="swiper-slide"><img src="image/hotel.png" /></div>
    </div>
    <div class="swiper-button-next"> </div>
    <div class="swiper-button-prev"> </div>
    </div>
    <div class="swiper mySwiper2">
    <div class="swiper-wrapper">
    <div class="swiper-slide"><img src="image/hotel.png" /></div>
    </div>
    </div>
    <p>
    <script type="text/javascript">// <![CDATA[
    	 var Swiper1 = new Swiper(".mySwiper1", {
    		 loop: true,
    	   navigation: {
    	     nextEl: ".swiper-button-next",
    	     prevEl: ".swiper-button-prev",
    	   },
    	 });
    	 var Swiper2 = new Swiper(".mySwiper2", {
    		 loop: true,
    	   navigation: {
    	     nextEl: ".swiper-button-next",
    	     prevEl: ".swiper-button-prev",
    	   },
    	 });
    	 Swiper1.controller.control = Swiper2;//需要在Swiper2初始化后,Swiper1控制Swiper2
    	 Swiper2.controller.control = Swiper1;//需要在Swiper1初始化后,Swiper2控制Swiper1
    	
    // ]]></script>
    </p>


    代码格式懒得整理了,swiper双向控制要注意的一点就是
    Swiper1.controller.control = Swiper2;
    Swiper2.controller.control = Swiper1;
    官方文档中,需要把params改成controller
    其他不变即可
    下方为官方文档:
    Swiper1.params.control = Swiper2;//需要在Swiper2初始化后,Swiper1控制Swiper2
    Swiper2.params.control = Swiper1;//需要在Swiper1初始化后,Swiper2控制Swiper1

      

     

    代码改变了我们,也改变了世界
  • 相关阅读:
    测试用例设计方法
    软件测试--常考的证书
    fillder-----接口延时返回(新方法)
    测试工作之--adb代码
    设计测试用例的常用方法
    TFS2013 设置签出独占锁
    Sql Server (MSSQLSERVER) 服务无法启动
    Sql 四大排名函数(ROW_NUMBER、RANK、DENSE_RANK、NTILE)简介
    C#使用redis学习笔记
    C#使用mybatis学习笔记
  • 原文地址:https://www.cnblogs.com/wencaiguagua/p/15660384.html
Copyright © 2011-2022 走看看