CODEWITHSUNDEEP
jquerycsstwitter-bootstrap
Khrys
Khrys

Reputation: 2774

Change class of Panel right before the click

How can I change the class before the animation starts/open/close the panel? Actually the class changes after the animation/panel is opened or closed.

Example: http://jsfiddle.net/0b9jppve/

Actual code:

$('#accordion').find('.panel-default:has(".in")').addClass('panel-danger');

$('#accordion').on('shown.bs.collapse', function (e) {
   $(e.target).closest('.panel-default').addClass(' panel-danger');
}).on('hidden.bs.collapse', function (e) {
   $(e.target).closest('.panel-default').removeClass(' panel-danger');
})

Upvotes: 0

Views: 54

Answers (1)

Ted
Ted

Reputation: 14927

All you need to do is change the events you're listening for. The events hide.bs.collapse and show.bs.collapse fire when the animation starts, hidden.bs.collapse and shown.bs.collapse fire on completion.

$('#accordion').on('show.bs.collapse', function (e) {
   $(e.target).closest('.panel-default').addClass(' panel-danger');
}).on('hide.bs.collapse', function (e) {
   $(e.target).closest('.panel-default').removeClass(' panel-danger');
})

See this updated fiddle

Upvotes: 1

Related Questions