panda_web/assets/js/common/index.js

//DOM操作、Ajax
import 'http://code.jquery.com/jquery-2.1.1.min.js';
//轮播图
import Swiper from 'https://unpkg.com/swiper@8/swiper-bundle.esm.browser.min.js';
window.Swiper = Swiper;
// bootstrap
import 'https://cdn.staticfile.org/bootstrap/5.1.3/js/bootstrap.min.js';

/**
 * 执行动画
 * @param ele 元素的选择器
 * @description 如果元素滚动至距离底部150px以上，添加css动效
 */
window.showAnimate = function (ele, className) {
  //监听页面滚动
  window.onscroll = function (event) {
    if ($(ele).offset().top <= $(window).height() + $(window).scrollTop() - 150) {
      $(ele).addClass(className)
    }
  }
}

let swiper = new Swiper('#swiper1', {
  pagination: {
    el: '.swiper-pagination',
  },
  loop: true, //循环
  observer: true, //修改swiper自己或子元素时，自动初始化swiper
  observeParents: true, //修改swiper的父元素时，自动初始化swiper
  speed: 500,
  autoplay: {
    disableOnInteraction: false, //触碰后自动轮播也不会停止
    delay: 3000,
  },
})