Bir Bootstrap Akordeon açıldıktan sonra içeriğe kaydırma

Question

İçinde birçok panel bulunan bir Bootstrap Akordeon var. Karşılaştığım sorun, panelin sayfayı açması durumunda, kullanıcının panelin açık olduğu konusunda hiçbir fikri olmadığı ve aşağı kaydırılabileceğidir.

Bunu çözmek için, şu anda açık olan içeriğe kaydırmak istedim, böylece içeriğin açık olduğunu ve kayda geçmesini sağladığını kaydettim.

Denemeye çalışırken denemelere koşuyor gibi görünüyor.

Bu ... benim fonksiyon

şimdiye kadar denedim

$('.accLink').on('click', function(){ 
    if($(this).parent().next('.panel-collapse').hasClass('in')){ 

    }else{ 
    //This is where the scroll would happen 
    } 
}); 

neye benzediğini

$('html, body').animate({ 
    scrollTop: ($(this).parent().next('.panel-collapse')) 
    },500); 

ve

$('div').animate({ 
    scrollTop: ($(this).parent().next('.panel-collapse')) 
    },500); 

Ben de böyle bir şey denedim olduğunu ..

function scrollToElement(ele) { 
    $(window).scrollTop(ele.offset().top).scrollLeft(ele.offset().left); 
} 

var element = $(this).parent().next('.panel-collapse').attr('id'); 
scrollToElement($('#'+element)); 

ancak sayfaya hiçbir şey yapmayın. sadece orada oturuyor. Herhangi bir yardım takdir edilecektir!

Answer 1

Aksine ayrı tıklama etkinlik dinleyici yerine, Bootstrap yerleşik olay geri arama kullanın: Eğer başlığı göstermek istiyorsanız,

$("#accordion").on("shown.bs.collapse", function() { 
    var myEl = $(this).find('.collapse.in'); 

    $('html, body').animate({ 
     scrollTop: $(myEl).offset().top 
    }, 500); 
}); 

Veya:

$("#accordion").on("shown.bs.collapse", function() { 
    var myEl = $(this).find('.collapse.in').prev('.panel-heading'); 

    $('html, body').animate({ 
     scrollTop: $(myEl).offset().top 
    }, 500); 
});