Fade in effect

[angvishvish]

How can I have fade in effect, without making any tab active.

<div class="tab-content">
  <!-- I don't want the any tab-pane to be active, and still want fade in effect -->
  <div class="tab-pane fade in active" id="home">...</div>
  <div class="tab-pane fade" id="profile">...</div>
  <div class="tab-pane fade" id="messages">...</div>
  <div class="tab-pane fade" id="settings">...</div>
</div>

[hnrch02]

Please be more specific. Do you want a fade-in effect for any element, not only for tabs?

[angvishvish]

In this code after page load the first tab is active, which I don't want.
I don't want any of the tabs active.
I want all the tabs to be inactive on page load, now when I don't have any tabs open, I will click on any one of them and fade in effect should work, which doesn't work right now.

[hnrch02]

Well, if no tabs are active then what do you want to fade in initially?

[angvishvish]

Initially all tab-pane should be inactive.
When I click on any tab, tab content should show fade effect.

[hnrch02]

Ah, thanks for explaining, now I get it. JS Bin demonstrating the problem.

[angvishvish]

Right you got my point, see the problem I am facing this issue. Hope somebody solve it soon.

[Merg1255]

Yup, good catch this one. :)