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

      

     

    代码改变了我们,也改变了世界
  • 相关阅读:
    BZOJ1717: [Usaco2006 Dec]Milk Patterns 产奶的模式
    BZOJ1031: [JSOI2007]字符加密Cipher
    关于后缀数组的实现
    BZOJ1692: [Usaco2007 Dec]队列变换
    BZOJ1725: [Usaco2006 Nov]Corn Fields牧场的安排
    POJ 2386 Lake Counting(搜索联通块)
    POJ 2386 Lake Counting(搜索联通块)
    Java演示设计模式中的写代码的代码
    Java演示设计模式中的写代码的代码
    源码映射
  • 原文地址:https://www.cnblogs.com/wencaiguagua/p/15660384.html
Copyright © 2011-2022 走看看