---
# System prepended metadata

title: 手風琴標題加active
tags: [Bootstrap]

---

---
tags: Bootstrap
---

# 手風琴標題加active
```javascript=1
$('.panel-collapse.in').siblings('.panel-heading').addClass('active');
$('.panel-collapse').on('show.bs.collapse', function() {
  $(this).siblings('.panel-heading').addClass('active');
});

$('.panel-collapse').on('hide.bs.collapse', function() {
  $(this).siblings('.panel-heading').removeClass('active');
});
```
---
```javascript=1
$('.panel-collapse.in').each(function(){
  $(this).prev('.panel-heading').addClass('active');
});
$('.panel-collapse').on('show.bs.collapse', function() {
  $(this).prev('.panel-heading').addClass('active');
});
$('.panel-collapse').on('hide.bs.collapse', function() {
  $(this).prev('.panel-heading').removeClass('active');
});
```
---
## Bootstrap 4 accordion
```javascript=1
$('.collapse').on('shown.bs.collapse', function () {
  $(this).prev().addClass('active-acc');
});

$('.collapse').on('hidden.bs.collapse', function () {
  $(this).prev().removeClass('active-acc');
 });
```