最后一页显示循环中第一页的项目

问题描述

我启用了 SlideBy,我一次传递 3 个项目,但我想要这样,当转到最后一页时,我没有在第一页上显示这些项目

启用循环

演示 https://jsfiddle.net/willBoB/3fqn80sp/20/

$(document).ready(function(){
  $('.owl-carousel').owlCarousel({
    nav: true,loop: true,slideBy: 3
  });
});
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" integrity="sha512-tS3S5qG0BlhnQROyJXvNjeEM4UpMXHrQfTGmbQ1gKmelCxlSEBUaxhRBj/EFTzpbP4RVSrpEikbmdJobCvhE3g==" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" integrity="sha512-sMXtMNL1zRzolHYKEujM2AqCLUR9F2C4/05cdbxjjLSRvMQIciEPCQZo++nk7go3BtSuK9kfa/s+a4f4i5pLkw==" crossorigin="anonymous"/>



<div class="owl-carousel owl-theme">
  <div> <img src="https://picsum.photos/id/1/50/30"> </div>
  <div> <img src="https://picsum.photos/50/30"> </div>
  <div> <img src="https://picsum.photos/50/30"> </div>
  <div> <img src="https://picsum.photos/50/30"> </div>
  <div> <img src="https://picsum.photos/50/30"> </div>
  <div> <img src="https://picsum.photos/50/30"> </div>
  <div> <img src="https://picsum.photos/50/30"> </div>

  <div> <img src=""> </div>

</div>


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcop+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js" integrity="sha512-bPs7Ae6pVvhOSiIcyUClR7/q2OAsRiovw4vAkX+zJbw3ShAeeqezq50RIIcIURq7Oa20rW2n2q+fyXBNcU9lrw==" crossorigin="anonymous"></script>

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)