Swiper异形轮播

最新推荐文章于 2023-08-29 16:47:56 发布

原创最新推荐文章于 2023-08-29 16:47:56 发布 · 2.4k 阅读

3 ·

CC 4.0 BY-SA版权

Swiper 专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何使用Swiper实现异形轮播效果，包括配置参数详解，如loop循环播放、effect翻转效果、grabCursor抓取光标、centeredSlides居中滑块及slidesPerView自动调整视图等。

Swiper异形轮播的配置：

    let swiper = new Swiper(".swiper-container", {
      loop: true,
      pagination: {
          el:'.swiper-pagination',//显示圆点
          clickable: true //圆点是否可点击
      },
      effect: "coverflow",
      grabCursor: true,
      centeredSlides: true,
      slidesPerView: "auto"
    });

Swiper官网

官网Swiper各种例子

Swiper各种配置

如下图：