Bootstrap responsive tabs not working when window is not minimized

Question

I used bootstrap responsive tabs, included everything that needs to be included. Tabs are working properly when i resize/minimize the window, but when the window is not minimized, they don't work.

<ul class="nav nav-tabs responsive" id="myTab">
    <li class="active"><a href="#home">Home</a></li>
    <li><a href="#profile">Profile</a></li>
    <li><a href="#messages">Messages</a></li>
</ul>

<div class="tab-content responsive">
    <div class="tab-pane active" id="home">...content...</div>
    <div class="tab-pane" id="profile">...content...</div>
    <div class="tab-pane" id="messages">...content...</div>
</div>

Here is my code http://jsfiddle.net/rQZym/3/ Thanks!

Answer 1

The tabs received no click event.

        if ($this.parent().hasClass('active')) {
            active = ' in';
        }
        // Added click event for tabs.
        $this.click(function (e) {
          e.preventDefault();
          $this.tab('show');
       });

http://fiddle.jshell.net/y7TS5/3/
http://fiddle.jshell.net/y7TS5/3/show/