const $mySwiper = $(".mySwiper") // получаем jQuery element для нашего свайпер контейнера
let swiperSlides = [ ...swiperCASES.slides ];
$(document).on('click', '.case__box', function(e) {
const filterData = e.target.dataset.filter;
const check = filterData;
$('.case__box').removeClass('case__box--active');
$mySwiper.fadeOut(300, () => { // плавно скрываем его и в коллбэк функции, которая выполнится после скрытия делаем фильтрацию и тд
swiperCASES.removeAllSlides()
const slides = swiperSlides.filter((item, index) => $(item)[0].dataset.filter == check || filterData == "all")
swiperCASES.params.grid.rows = slides.length <= swiperCASES.params.slidesPerView ? 1 : 2
swiperCASES.appendSlide(slides)
swiperCASES.updateProgress();
swiperCASES.updateSize();
swiperCASES.updateSlides();
swiperCASES.update();
$mySwiper.fadeIn(300) // и плавно возвращаем обратно
$(this).addClass('case__box--active');
})
})Хотя все вычисления делаются в микротасках
<div class="one">
<div class="two">
<h5>Третий элемент</h5>
<input class="quantity" type="number" min="1" max="99" value="1" title="Количество" inputmode="numeric">
</div>
<div class="three">
<p>какой-то текст</p>
<span class="price-amount">888<span>₴</span></span>
</div>
</div>const qty = document.querySelectorAll('.quantity');
for(let i=0;i<qty.length;i++){
let amount = qty[i].closest('.one').querySelector('.three .price-amount')
let price = +parseInt(amount.textContent);
qty[i].addEventListener('input', () => amount.textContent = qty[i].value*price+'₴');
}qty[i].closest('.one').querySelector('.three .price-amount')<p id="text"> lorem ipsum</p>https://my-site.ru#text.
В чем может быть загвоздка