怎么才能让它swiper自动翻页时停在最后一页，无论你怎么翻页他都自动翻到最后一页，然后停止？谢谢

Posted 2023-04-17

var swiper = new Swiper('.swiper-container',
pagination: '.swiper-pagination',
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev',
//direction: 'vertical',//上下翻页
loop : true,//循环
spaceBetween: 0, // 两图片间距
autoplay: 3000, //翻页时间
autoplayDisableOnInteraction: false
);

这个好像没有办法解决的，彩信翻页是彩信内容本身设定的一个参数，也就是翻页时间间隔，这个参数在发给你手机之前就设定好了的。追问

你好，我在上面设定了3秒翻页，因为最后一页有触发链接，所以我想让它停在最后一页的时间长一些，也就是大于前面几个页面的时间，或者直接停在最后一页，有什么办法？谢谢

参考技术A loop：false；循环关了不就停在最后一页了 参考技术B autoplayStopOnLast: true,加上这个就可以了 参考技术C 滚到到最后一页时，设置loop：false；并且禁止swiper滚到,,设置定时器，在你允许的时间之后继续滚动

swiper的基本使用（十三）

本文为H5EDU机构官方的HTML5培训教程 swiper教程swiper教程。
 
本次内容我们介绍在swiper页面当中添加控制按钮（可以控制翻页上一页和下一页）。
 
首先搭建基础的swiper页面布局。然后我们主要将翻页按钮的div（.swiper-button-next/prev）加到外部容器(.swiper-container)当中.

 <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">H5EDU 1<img src="logo.png"></div>
                <div class="swiper-slide">H5EDU 2<img src="logo.png"></div>
                <div class="swiper-slide">H5EDU 3<img src="logo.png"></div>
                <div class="swiper-slide">H5EDU 4<img src="logo.png"></div>
                <div class="swiper-slide">H5EDU 5<img src="logo.png"></div>
                <div class="swiper-slide">H5EDU 6<img src="logo.png"></div>
            </div>
            <div class="swiper-pagination"></div>
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
        </div>

然后到js部分初始化函数并且绑定翻页按钮的类。

 var swiper = new Swiper(‘.swiper-container‘,{
                pagination:‘.swiper-pagination‘,
                paginationClickable:true,
                spaceBetween:30,
                nextButton:‘.swiper-button-next‘,//绑定下一页的控制按钮
                prevButton:‘.swiper-button-prev‘//绑定上一页的控制按钮
            });

我们可以通过类名来改变控制按钮的颜色。并且控制按钮会随着我们的属性改变而改变为对应的样式或添加功能

点击进入swiper强化教程：http://h5edu.cn/index.php?c=index&a=step&lessonid=893