У меня стоит простой бутстраповский аккордеон, при нажатии открывается одна и закрывается другая скрытая информация. Но есть проблема, когда в скрытом содержимом большое количество информации, при попытке открытии следующей, аккордеон сдвигается наверх. Нужен скрипт для фиксированного заголовка аккордеона. Смогли бы вы помочь с этим? Cнизу код html
<div class="panel-group accordion" id="panel-651270">
<div class="panel panel-default">
<div id="yazyk-kurs" class="panel-heading">
<i class="fa fa-globe fa-lg" aria-hidden="true"></i>
<a class="panel-title collapsed" data-toggle="collapse" data-parent="#panel-651270" href="#panel-element-366587" > Языковые курсы </a>
</div>
<div id="panel-element-366587" class=" panel-collapse collapse">
<div class="panel-body ">
<table align="center" class="table table-bordered table-hover table-condensed col-xs-12" >
<thead>
<tr class="info" align="center" valign="middle">
<th align="center" valign="middle">Наименование курса </th><th>кол-во учебных часов.<br> Продолжительность курса</th><th>стоимость курса <br> <small>(в манатах)</small></th>
</tr>
</thead>
<body>
<tr> <td> Английский язык <br> <small>(I уровень)</small></td> <td><small>182 учебных часа <br> 4 месяца. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>698</td></tr>
<tr> <td> Английский язык <br> <small>(II-VI уровень)</small></td> <td><small>142 учебных часа <br> 4 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>546</td></tr>
<tr> <td> Практический курс Английского языка <small>(I уровень)</small></td> <td><small>72 учебных часа <br> 2 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>276</td></tr>
<tr> <td> Практический курс Английского языка <small>(II-VI уровень)</small></td> <td><small>144 учебных часа <br> 4 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>553</td></tr>
<tr> <td> Английского языка для работников Банка </td> <td><small>122 учебных часа <br> 3 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>468</td></tr>
<tr> <td> Туркменский язык, Французский язык, <br> Арабский язык <small>(I-III уровень)</small> </td> <td><small>142 учебных часа <br> 4 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>545</td></tr>
<tr> <td> Русский язык<br> <small>(I-II уровень)</small> </td> <td><small>160 учебных часов <br> 4 месяца. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>615</td></tr>
<tr> <td> Немецкий язык<br> <small>(I-IV уровень)</small> </td> <td><small>180 учебных часов <br> 4 месяца. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>691</td></tr>
<tr> <td> Китайский язык<br> <small>(I уровень)</small> </td> <td><small>148 учебных часов <br> 4 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>568</td></tr>
<tr> <td> Китайский язык<br> <small>(I-III уровень)</small> </td> <td><small>136 учебных часов <br> 4 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>523</td></tr>
<tr> <td> Турецкий язык<br> <small>(I уровень)</small> </td> <td><small>72 учебных часа <br> 2 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>276</td></tr>
<tr> <td> Турецкий язык<br> <small>(II уровень)</small> </td> <td><small>68 учебных часов <br> 2 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>261</td></tr>
<tr> <td> Персидский язык<br> <small>(I-II уровень)</small> </td> <td><small>74 учебных часа <br> 2 месяца. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td><td>284</td></tr>
</body>
</table>
</div>
</div>
</div>
<div class="panel panel-default">
<div id="komp-kurs" class="panel-heading">
<i class="fa fa-desktop fa-lg" aria-hidden="true"></i>
<a class="panel-title collapsed" data-toggle="collapse" data-parent="#panel-651270" href="#panel-element-435532">Основы компьютерных технологий</a>
</div>
<div id="panel-element-435532" class="panel-collapse collapse">
<div class="panel-body ">
<table class="table table-bordered table-hover table-condensed col-xs-12">
<thead>
<tr class="info">
<th>Наименование курса </th><th>кол-во учебных часов.<br> Продолжительность курса</th><th>стоимость курса <br> <small>(в манатах)</small></th>
</tr>
</thead>
<body>
<tr> <td> Microsoft Windows; Microsoft Office: Word, Excel, PowerPoint, Internet</td> <td><small>86 учебных часов <br> 1,3 месяца. 15 ч. в неделю. <br> 5 раз по 3 уч.ч.
</small></td><td>403</td></tr>
<tr> <td> Техническое обслуживание и настройка ПЭВМ</td> <td><small>72 учебных часа <br> 1,2 месяца. 15 ч. в неделю. <br> 5 раз по 3 уч.ч.
</small></td><td>338</td></tr>
<tr> <td> Adore PhotoShop</td> <td><small>42 учебных часа <br> 1 месяц. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>197</td></tr>
<tr> <td> CorelDraw</td> <td><small>48 учебных часа <br> 1 месяц. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>252</td></tr>
</body>
</table>
</div>
</div>
</div> <!-- open-closed panel div ending tag-->
<div class="panel panel-default">
<div id="programming" class="panel-heading">
<i class="fa fa-code fa-lg" aria-hidden="true"></i>
<a class="panel-title collapsed" data-toggle="collapse" data-parent="#panel-651270" href="#panel-element-4355321">Программирование</a>
</div>
<div id="panel-element-4355321" class=" panel-collapse collapse">
<div class="panel-body ">
<table class="table table-bordered table-hover table-condensed col-xs-12">
<thead>
<tr class="info">
<th>Наименование курса </th><th>кол-во учебных часов.<br> Продолжительность курса</th><th>стоимость курса <br> <small>(в манатах)</small></th>
</tr>
</thead>
<body>
<tr><td> Программирование на С/С++ </td> <td><small>150 учебных часа <br> 2 месяцa. 20 ч. в неделю. <br> 5 раза по 4 уч.ч.
</small></td><td> 704 </td></tr>
<td>Программирование в HTML</td><td><small>150 учебных часа <br> 2 месяцa. 20 ч. в неделю. <br> 5 раза по 4 уч.ч.
</small></td><td>704</td></tr>
<tr><td> Программирование на C# и в среде NET</td> <td><small>150 учебных часа <br> 2 месяцa. 20 ч. в неделю. <br> 5 раза по 4 уч.ч.
</small></td> <td>704</td></tr>
<tr><td>Программирование на Java и JavaScript</td> <td><small>150 учебных часа <br> 2 месяцa. 20 ч. в неделю. <br> 5 раза по 4 уч.ч.
</small></td><td>704</td>
</tr>
</body>
</table>
</div>
</div>
</div> <!-- open-closed panel div ending tag-->
<div class="panel panel-default">
<div id="intellekt-kurs" class="panel-heading">
<i class="fa fa-connectdevelop fa-lg" aria-hidden="true"></i>
<a class="panel-title collapsed" data-toggle="collapse" data-parent="#panel-651270" href="#panel-element-4355322">ИНТЕЛЛЕКТУАЛЬНОЕ РАЗВИТИЕ</a>
</div>
<div id="panel-element-4355322" class="-collapse collapse">
<div class="panel-body ">
<table class="table table-bordered table-hover table-condensed">
<thead>
<tr class="info">
<th>Наименование курса </th><th>кол-во учебных часов.<br> Продолжительность курса</th><th>стоимость курса <br> <small>(в манатах)</small></th>
</tr>
</thead>
<body>
<tr> <td> Техника быстрого чтения <small>(I уровень)</small> </td> <td><small>48 учебных часов <br> 1 месяц. 12 ч. в неделю. <br> 4-5 раз по 3 уч.ч.
</small><td>200</td></tr>
<tr> <td> Техника быстрого чтения <small>(II уровень)</small> </td> <td><small>132 учебных часа <br> 3 месяц. 12 ч. в неделю. <br> 4-5 раз по 3 уч.ч.
</small></td><td>550</td></tr>
<tr> <td> Ораторское искусство</td> <td><small>54 учебных часа <br> 1,5 месяца. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>225</td></tr>
</body>
</table>
</div>
</div>
</div> <!-- open-closed panel div ending tag-->
<div class="panel panel-default">
<div id="psychology-kurs" class="panel-heading">
<i class="fa fa-graduation-cap fa-lg" aria-hidden="true"></i>
<a class="panel-title collapsed" data-toggle="collapse" data-parent="#panel-651270" href="#panel-element-4355323">ПСИХОЛОГИЯ И ПЕДАГОГИКА</a>
</div>
<div id="panel-element-4355323" class="panel-collapse collapse st-content">
<div class="panel-body ">
<table class="table table-bordered table-hover table-condensed">
<thead>
<tr class="info">
<th>Наименование курса </th><th>кол-во учебных часов.<br> Продолжительность курса</th><th>стоимость курса <br> <small>(в манатах)</small></th>
</tr>
</thead>
<body>
<tr> <td> Практическая психология </td> <td><small>220 учебных часов <br> 3 месяц. 20 ч. в неделю. <br> 5 раз по 4 уч.ч.
</small></td> <td>900</td></tr>
<tr> <td> Повышение квалификации педагогических кадров системы среднего профессионального образования</td><td><small>142 учебных часа <br> 2 месяца. 15 ч. в неделю. <br> 5 раз по 3 уч.ч.
</small></td> <td>590</td></tr>
<tr> <td> Этика и культура делового общения </td><td><small>36 учебных часов <br> 1 месяц. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td> <td>150</td></tr>
<tr> <td> Псилого-педагогический курс "ПРАКТИЧЕСКАЯ ПСИХОЛОГИЯ ДЛЯ ПОДРОСТКОВ" </td> <td><small>62 учебных часа <br> 2 месяца. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>258</td></tr>
<tr> <td> Псилого-педагогический курс "ПРАКТИЧЕСКАЯ ПСИХОЛОГИЯ ДЛЯ РОДИТЕЛЕЙ" <small>(I-II уровень)</small> </td> <td><small>56 учебных часов <br> 1,5 месяца. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>233</td></tr>
<tr> <td> Псилого-педагогический курс "ПРАКТИЧЕСКАЯ ПСИХОЛОГИЯ ДЛЯ РОДИТЕЛЕЙ" <small>(III-IV уровень)</small> </td> <td><small>48 учебных часов <br> 1 месяц. 12 ч. в неделю. <br> 4 раза по 3 уч.ч.
</small></td><td>200</td></tr>
<tr> <td> Социально-Психологический курс "СЕМЬЯ" </td><td><small>270 учебных часов <br> 7,5 месяцев. 9 ч. в неделю. <br> 3 раза по 3 уч.ч.
</small></td> <td>1123</td></tr>
<tr id="sekret_referent"> <td> Курс "СЕКРЕТАРЬ-РЕФЕРЕНТ" </td> <td><small>82 учебных часа <br> 1,5 месяца. 15 ч. в неделю. <br> 5 раз по 3 уч.ч.
</small></td><td>315</td></tr>
</body>
</table>
</div>
</div>
</div> <!-- open-closed panel div ending tag-->
