I created a vertical swiper with 3 slides with mousewheel control. I would like to scroll inside the swiper to stop when it reaches the edges and then start scrolling the page.
The version I'm using is the latest, version 7.
The issue is: When I scroll from slide 2 to slide 3 the page also slides a little bit, here's a video explaining the issue: https://www.loom.com/share/416dcfa2dea34bd1bde75b0441fdf7c0
This is the code I have so far:
let verticalSwiper = new Swiper( '.vertical-swiper-wrapper', {
direction: 'vertical',
slidesPerView: 1,
spaceBetween: 0,
effect: 'fade',
fadeEffect: {
crossFade: true
},
autoHeight: true,
mousewheel: {
sensitivity: 100,
releaseOnEdges: true,
},
pagination: {
el: '.swiper-pagination',
clickable: true,
},
} );
Any ideas how to fix this? Thanks!