Bootstrap 3 Template
This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.
HTML
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-default btn-lg no-border">
<span id="btnPencil" class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
<input id="checkboxPencil" type="checkbox" autocomplete="off">
</label>
<label class="btn btn-default btn-lg no-border">
<span id="btnSquare" class="glyphicon glyphicon-th-large" aria-hidden="true"></span>
<input id="checkboxSquare" type="checkbox" autocomplete="off">
</label>
<label class="btn btn-default btn-lg no-border">
<span id="btnSquare" class="glyphicon glyphicon-th-large" aria-hidden="true"></span>
<input id="checkboxSquare" type="checkbox" autocomplete="off">
</label>
</div>
CSS
/* Latest compiled and minified CSS included as External Resource*/
/* Optional theme */
@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
body {
margin: 10px;
}
JavaScript
/* Latest compiled and minified JavaScript included as External Resource */
btnp = document.getElementById(btnPencil)
btnp.addEventListener('change', function() {
// 1. check current button / checkbox
// 2. uncheck other buttons / checkbox
// bootstrap uncheck / check style ?
});