Redtama
Redtama

Reputation: 1613

Show/hide a Bootstrap Collapse element with no animation

I am aware that you can disable the collapse animation completely as is described in the accepted answer to this question.

But is there any way that I can disable the animation for a .collapse('show') or .collapse('hide') call as a one off? I would really like to be able to do something like this:

.collapse({'show', 
    animation : false        
});

But this option doesn't seem to exist.

Is this possible?

Upvotes: 1

Views: 3712

Answers (2)

Redtama
Redtama

Reputation: 1613

OK so this is the solution I came up with using JQuery

$("myCollapseElement").addClass("in");

will expand the element with no animation and

$("myCollapseElement").removeClass("in");

will collapse the element with no animation.

This solution suits my purposes, however there is a feature request to be able to do it the way I suggested in my question: Bootstrap Issue enable/disable animation of Collapse on a per-show/hide basis.

So when the guys over at twitter do release this feature I will update my answer. But for the time being, using JQuery to add the bootstrap class in works for me.

Upvotes: 0

Shashank Agrawal
Shashank Agrawal

Reputation: 25797

If you don't want the animation then why to use the collapse feature at all. Just use JQuery's hide & show.

$(".my-prev-collapse-element").hide();
$(".my-prev-collapse-element").show();

Based on the suggestion from @Redtama, the animation can directly be prevented from:

$("my-prev-collapse-element").addClass("in");
$("my-prev-collapse-element").removeClass("in");

to hide or show the element without animation.

Upvotes: 1

Related Questions