Всем привет. Подскажите, пожалуйста, как сделать так, чтобы .slick-current менял свой размер плавно? При прокрутке он должен становиться меньше, чем другие картинки, но у меня все как-то враскорячку, хоть он и становится меньше, но медленно или слишком быстро, в общем не хорошо.
<body>
<div class="wrapper">
<div class="slider">
<div class="slider__item">
<img src="img1.png" alt="">
</div>
<div class="slider__item">
<img src="img2.png" alt="">
</div>
<div class="slider__item">
<img src="img3.png" alt="">
</div>
</div>
</div>
<script src="js/jquery-3.6.0.min.js"></script>
<script src="js/slick.min.js"></script>
<script src="js/main.js"></script>
</body>
.slick-track {
display: flex;
align-items: flex-start;
}
.slick-list {
overflow: hidden;
}
.slick-current.slick-active img{
width: 250px;
height: 250px;
}
$(document).ready(function(){
$('.slider').slick({
dots:true,
slidesToShow: 2,
variableWidth: true,
adaptiveHeight: true,
});
});
Помогите, пожалуйста. Спасибо.
