I made 3 swipers in my application and only this one doesn't allow me to scroll the site with a swipe, here are the settings that I set for this swiper:
<Swiper allowTouchMove={false} effect={'fade'} direction={'vertical'} slidesPerView={1} loop={false} pagination={{ clickable: true, el: '.swiper-pagination', }} autoplay={{ delay: 5000, disableOnInteraction: false, }} modules={[EffectFade, Navigation, Pagination, Autoplay]} style={{ width: '100%', height: `${ isSmallScreen ? '350px' : isSmallScreenStyle ? '290px' : isSmallScreenStyleTwo ? '550px' : '700px' }`, marginTop: '20px', display: 'flex', flexDirection: 'row-reverse', position: 'relative', }}>
in swiper I tried to use properties such as:
1.touchMoveStopPropagation={true}
2.touchStartPreventDefault={false}
3.simulateTouch={false}
4.className="swiper-no-swiping" - CSS:
.swiper-no-swiping {
pointer-events: auto !important;
}
These methods didn't help.
I hope someone can tell me what's wrong.
I repeat, the problem is scrolling the entire page and not the slides.
I fixed the problem, for those who encountered such a problem, here is the reason: if you use the (direction={'vertical'}) swiper property, then for some reason it will not be possible to vertically scroll the page on mobile devices with your fingers, that is, with swipes.