swiper鼠标放上去停止滚动属性方法教程
swiper轮播图鼠标悬停暂停滑动、静止手动滑动、从第几个开始轮播...
1：鼠標移動到輪播圖暫停輪播(这个适合autoplay:true情况的时候使用，否则会触发swiper自动轮播
- mySwiper.el.onmouseover = function(){
- mySwiper.autoplay.stop();
- }
- mySwiper.el.onmouseout = function(){
- mySwiper.autoplay.start();
- }
2、禁止手动滑动
在最外层加上类名:swiper-no-swiping(给个别滑块加类名可以单独给对应滑块加)；
allowTouchMove: false,配置里加上这个是所有的滑块禁止手动滑动；
3、手动鼠标滑动了轮播图后，停止了自动轮播？
解决办法：配置autoplay项--- autoplay: { disableOnInteraction: false,delay: 2500, }
disableOnInteraction：
用户操作swiper之后，是否禁止autoplay。默认为true：停止。如果设置为false，用户操作swiper之后自动切换不会停止，每次都会重新启动autoplay。操作包括触碰(touch)，拖动，点击pagination等。
4、轮播图默认从第几个开始轮播？
配置属性 initialSlide :dayIndex,
5、slideChangeTransitionStart事件：滑块改变触发
- on: {
- slideChangeTransitionStart: function(){
- $($(".digitalReading .digitalReading_left .textBox img")[this.activeIndex]).click();
- },
- },
|
发表于 2023-2-22 14:02:43
