2017-05-28 43 views
5

JS FIDDLE OF MY ACCORDION如何集中手風琴頭球頂當我們點擊該

我試圖把重點放在頭或第​​一個div是手風琴內,但它無法正常工作。

在默認情況下,js小提琴是活躍的,它由11個問題組成。 現在PHP默認情況下它已摺疊,當我們點擊它時它會打開並且HTML會崩潰。

我的問題是,當我在PHP點擊它顯示在我的情況下,最後一個問題它顯示PHP的11日的問題,其實這應該顯示PHP第一quuestion我怎麼能實現呢..?

請參閱我共享的js小提琴。

我曾嘗試用3點不同的方法,但沒有一個是工作:

$("#panelForPHP").click(function(){  $("#accordionPHP").focus(); }); 
$("#panelForPHP").click(function(){  $("#collapsePHP1").focus(); }); 
$("#panelForPHP").click(function(){  $("#panelForPHP").focus(); }); 
+0

是的它正在擴大,但在頁面上我能夠看到最後一部分,我想看到頂部。 –

回答

1

要向上滾動面板機身頂部

$('#accordionMain').on('shown.bs.collapse', function() { 

    var panel = $(this).find('.in'); 

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

要向上滾動到面板標題,

$('#accordionMain').on('shown.bs.collapse', function() { 

    var panel = $(this).find('.in'); 

    $('html, body').animate({ 
     scrollTop: panel.offset().top -55 
    }); 
}); 
+0

它正在工作,但你能告訴我怎樣才能顯示類別。我可以看到你的代碼觸發'top'我想觸發'category'在我的情況下'PHP'應該可見頂部。 –

+0

@AbdulWaheed我編輯了答案,以符合您的要求。希望它有效! –

+0

它不工作這是一個大問題,因爲當我打開問題11時,它顯示你的兩種情況下的第一個問題。 @搽旦-RG –

1

手風琴的層次結構使問題在你的情況下變得很複雜。當你打開'PHP'的'問題11'時,它會滾動到'.in'類的第一個元素。 '.in'類通過引導腳本插入活動面板主體。當點擊「問題11」時,有兩個活動的面板體,第一個包含PHP下的11個問題,第二個包含問題11的答案。

在這種情況下,您需要使用'.in'類捕獲最後一個面板體。

var panel = $(this).find('.in').last(); 

如果關閉了PHP(父手風琴)再次離開的問題(兒童手風琴)開放,開放的家長手風琴它會滾動到最後一個開兒童手風琴,因爲它是與」。在最後一個元素類。

相關問題