鍍金池/ 問(wèn)答/HTML/ 如何用swper.js實(shí)現(xiàn)這樣的3d切換?

如何用swper.js實(shí)現(xiàn)這樣的3d切換?

clipboard.png

回答
編輯回答
澐染

let params = {

autoplay: 3000, // 每隔n秒滑動(dòng)
loop: true, // 循環(huán)
pagination: '.swiper-pagination',
slidesPerView: 'auto', // 同時(shí)顯示的slides數(shù)量
centeredSlides: true, // 居中
spaceBetween: 8, // silde間距
effect : 'coverflow', // 3D界面顯示
coverflow: {
    rotate: 35, // Y軸旋轉(zhuǎn)角度
    slideShadows: false // slide陰影
}

};

2018年8月21日 14:46
編輯回答
雅痞
 var swiper = new Swiper('.swiper-container', {
      effect: 'coverflow',
      grabCursor: true,
      centeredSlides: true,
      slidesPerView: 'auto',
      coverflowEffect: {
        rotate: 50,
        stretch: 0,
        depth: 100,
        modifier: 1,
        slideShadows : true,
      },
      pagination: {
        el: '.swiper-pagination',
      },
    });
2018年4月16日 07:18