Это аккордеон в начальной загрузке, часть тела больше, чем обычно, поэтому, когда раздел сворачивается, содержимое под ним прокручивается вверх.
Я использую этот код, чтобы прокрутить верхнюю часть заголовка, по которому щелкнули, и отменитьпрокрутка, вызванная свертыванием ранее открытого раздела.
, но, кажется, он запускается перед свертыванием предыдущего.Я исследовал в интернете и не смог найти решение.
код не очень длинный, чтобы поделиться соответствующим фрагментом.Также заполняет тело карты, используя ajax при нажатии на заголовок
<div id="accordion" class="row"></div>
<script>
success: function(res) {
let resultHtml = ``;
for (let i = 0; i < res.length; i++) {
resultHtml +=
`
<div class="card col-12 px-0">
<div class="card-header" id="heading${i}">
<h5 class="mb-0">
<button class="btn btn-link w-100 text-left btn-expand" data-toggle="collapse" data-target="#collapse${i}" data-place-id="${ res[i].place_id }" aria-expanded="false" aria-controls="collapse${i}"><img class="place-icon" src="${ res[i].icon }">
${ res[i].name }
<span class="float-right">Rating: ${ getStars(res[i].rating) }</span>
</button>
</h5>
</div>
<div id="collapse${i}" class="collapse" aria-labelledby="heading${i}" data-parent="#accordion">
<div class="card-body"></div>
</div>
</div>`;
}
$("#accordion").html(resultHtml);
$('#accordion').on('hide.bs.collapse', function () {
$('html, body').animate({
scrollTop: $( event.target ).parent().offset().top
}, 400);
});
</script>
shown.bs.collapse и hidden.bs.collapse у меня не работают.show.bs.collapse и hidde.bs.collapse стреляют, но все еще не работают.
Спасибо