swiper轮播器的常用案例分析（swiper hover停止mouseover停止）

Posted 2020-09-04 WEB前端--haley

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了swiper轮播器的常用案例分析（swiper hover停止mouseover停止）相关的知识，希望对你有一定的参考价值。

hover停止需要自己设置，代码如下

var mySwiper= new Swiper(\'.swiper-container\', {
       //这里的常规的设置参数
        pagination: \'.swiper-pagination\',
        slidesPerView: 5,
        paginationClickable: true,
        spaceBetween: 30,
        loop:true,
        autoplay:1000,
        loopedSlides:5
    });
    $(\'.swiper-container\').mouseover(function(){
        mySwiper.stopAutoplay();
    })
    $(\'.swiper-container\').mouseout(function(){
        mySwiper.startAutoplay();
    })

注意事项：名称一定要一致，至于事件加到谁身上，自己决定。

以上是关于swiper轮播器的常用案例分析（swiper hover停止mouseover停止）的主要内容，如果未能解决你的问题，请参考以下文章

vue封装组件swiper轮播组件

swiper 移动端和PC端的常用解决方案