網頁滑動切換插件推薦：Swiper 實現 PC/手機端全兼容滑動效果

推薦插件：Swiper

官網：https://www.swiper.com.cn/（中文文檔完整）

核心特性

• 觸摸/鼠標/鍵盤多模式交互。
• 響應式斷點、循環、自動播放、視差、3D 效果豐富。
• 模塊化按需引入，體積小（core ~30KB gz）。
• 框架無關：原生 JS、React、Vue、Angular、Svelte 皆有組件庫。
• IE10+、現代瀏覽器、微信小程序、UniApp 全支援。

快速上手

<!-- HTML -->
<div class="swiper">
  <div class="swiper-wrapper">
    <div class="swiper-slide">Slide 1</div>
    <div class="swiper-slide">Slide 2</div>
  </div>
  <div class="swiper-pagination"></div>
  <div class="swiper-button-prev"></div>
  <div class="swiper-button-next"></div>
</div>

<!-- JS -->
const swiper = new Swiper('.swiper', {
  loop: true,
  pagination: {el: '.swiper-pagination'},
  navigation: {nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev'},
});

替代方案

• FullPage.js：全屏滾動、錨點導航、適合單頁官網。
• Owl Carousel 2：jQuery 依賴、舊項目常用。
• Glide.js：輕量、無依賴、ESM 友好。