Skip to content

Instantly share code, notes, and snippets.

@jsc-dev
Created June 1, 2015 21:30
Show Gist options
  • Save jsc-dev/951da6a4582faf003f2c to your computer and use it in GitHub Desktop.
Save jsc-dev/951da6a4582faf003f2c to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>test</title>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
</style>
<body>
<div class="container">
<div role="tabpanel">
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist" id="demotabs">
<li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
<li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
<li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
<li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="home">...1</div>
<div role="tabpanel" class="tab-pane" id="profile">...2</div>
<div role="tabpanel" class="tab-pane" id="messages">...3</div>
<div role="tabpanel" class="tab-pane" id="settings">...4</div>
</div>
</div>
<a href="#messages" class="btn btn-success open_tab">trigger tab3</a>
</div>
<script type="text/javascript">
$(document).ready(function(){
// open/jumps @ bootstrap tabs/accordion
$(".open_tab").click(function() {
var n = $(this).attr("href");
//open the tab
$('#demotabs a[href="' + n + '"]').tab('show');
//open the accordion
// $(n).collapse({ toggle: true });
return false;
});
$('.open_tab').trigger('click');
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment