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

      

     

    代码改变了我们,也改变了世界
  • 相关阅读:
    关于MySQL数据库中null的那些事
    Java集合之Collections 剖析
    字符串类
    C++标准库
    << 操作符
    操作符的重载
    类中的重载
    友元
    二阶构造模式
    静态成员函数
  • 原文地址:https://www.cnblogs.com/wencaiguagua/p/15660384.html
Copyright © 2011-2022 走看看