javascript - Bootstrap Tab is not working when tab with data-target instead of href -
i developing bootstrap tabs use of data-target
attribute match tab panes instead of using href
attribute, since developing angular app(href
might spoil route ).
<ul class="nav nav-tabs" id="mytab"> <li class="active"><a data-target="home">home</a></li> <li><a data-target="profile">profile</a></li> <li><a data-target="messages">messages</a></li> <li><a data-target="settings">settings</a></li> </ul> <div class="tab-content"> <div class="tab-pane active" id="home">...</div> <div class="tab-pane" id="profile">...</div> <div class="tab-pane" id="messages">...</div> <div class="tab-pane" id="settings">...</div> </div> <script> jquery(function () { jquery('#mytab a:last').tab('show') }) </script>
please see fiddle http://jsfiddle.net/xfw8t/4/. recreated whole .
i don't want bootstrap style applied tabs, want functionality, want styles applied , anyway stop bootstrap style applied? please in in advance help.
add data-toggle="tab"
attribute in markup
<a data-target="#home" data-toggle="tab">home</a>
Comments
Post a Comment