Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<div class="row">
  <div id='myTab' class="tabbable tabs-left">
  
              <ul class="nav nav-tabs nav-stacked col-xs-2">
                <li class="active"><a href="#lA" data-toggle="tab">Section 1</a></li>
                <li class=""><a href="#lB" data-toggle="tab">Section 2</a></li>
                <li class=""><a href="#lC" data-toggle="tab">Section 3</a></li>
              </ul>
  
              <div class="tab-content col-xs-10">
                <div class="tab-pane active" id="lA">
                  <p>I'm in Section A.</p>
                </div>
                <div class="tab-pane" id="lB">
                  <p>Howdy, I'm in Section B.</p>
                </div>
                <div class="tab-pane" id="lC">
                  <p>What up girl, this is Section C.</p>
                </div>
              </div>
            </div>
  </div>
</body>
</html>
 
$('#myTab a').click(function (e) {
    if($(this).parent('li').hasClass('active')){
        $( $(this).attr('href') ).hide();
    }
    else {
        e.preventDefault();
        $(this).tab('show');
    }
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers