problem touchmove slide swiper #4243
Description
hi, I have a serious problem
when I will add this part of the style command
.scroll{
overflow: auto;
height: 100%;
}
I think the performance will have a problem, I will put the sample code for you, of course, in the version
7.1.5 works properly but when I put the last update 8.3.0 doesn't work
Please fix this problem for me or guide me to fix it. Regards
var swiper = app.swiper.create('.swiper', {
speed: 100,
spaceBetween: 10,
allowTouchMove: true,
initialSlide: 0,
loop: true,
})
<style>
.swiper {
width: 100%;
height: 100%;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
display: flex;
justify-content: center;
align-items: center;
}
.swiper-slide img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.scroll{
overflow: auto;
height: 100%;
}
</style>
<div dir="rtl" class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="scroll">Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/>Slide 1<br/></div></div>
<div class="swiper-slide"><div class="scroll">Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/>Slide 2<br/></div></div>
<div class="swiper-slide"><div class="scroll">Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/>Slide 3<br/></div></div>
</div>
</div>