Wie erstellt man mehrere Swiper Schieberegler mit einer Paginierung?

Question

Ich möchte 2 Schieberegler mit einer Paginierung machen. Ich benutze Swiper 2.7.6.

Beide Schieberegler sollten unterschiedliche Effekte haben. Ich habe kein Beispiel auf der offiziellen Seite gefunden. Ich möchte, dass es wie this aussieht. Hier ist ein Code:

if ($('.photo-slider').length) { 
    $('.photo-slider').each(function(i){ 
     var $this = $(this); 
     //slider ID 
     var id = 'photo_slider_'+i; 
     // $this.find('.slider').attr('id', id); 
     $this.find('.slider').attr('id', id); 
     // pagination 
     var paginationClass = 'pagination-photo'+i; 
     $('.photo-slider').append('<div class="slider-pagination for-photo '+paginationClass+'"></div>'); 

     var $slider = new Swiper('#'+id, { 
      slidesPerView: 1, 
      loop: true, 
      grabCursor: true, 
      calculateHeight: true, 
      pagination: '.'+paginationClass, 
      paginationClickable: true 
     }); 

     $this.find('.slider-arrow').on('click', function(){ 
      if ($(this).hasClass('prev')) { 
       $slider.swipePrev(); 

      } else { 
       $slider.swipeNext(); 
      } 

      return false; 
     }); 

     i++; 
    });   
} 

Answer 1

Versuchen Sie, 2 separate Instanzen von swiper Diashows zu verknüpfen mit nur 1 Satz Paginierung/nav?

Warum nicht einfach die Paginierung & Nav-Tasten auf einer Instanz? Wenn du sie verlinkt hast, wirkt sich die Bewegung auf die andere aus.