0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-12 00:08:59 +01:00
Bootstrap/js/tests/visual/button.html

65 lines
1.6 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html>
<head>
<title>Button</title>
<link rel="stylesheet" type="text/css" href="../../../dist/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="page-header">
<h1>Button <small>Bootstrap Visual Test</small></h1>
</div>
<button type="button" data-loading-text="Loading for 3 seconds..." class="btn btn-primary js-loading-button">
Loading state
</button>
<button type="button" class="btn btn-primary" data-toggle="button">Single toggle</button>
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary">
<input type="checkbox"> checkbox 1
</label>
<label class="btn btn-primary">
<input type="checkbox"> checkbox 2
</label>
<label class="btn btn-primary">
<input type="checkbox"> checkbox 3
</label>
</div>
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary">
<input type="radio" name="options" id="option1"> Radio 1
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="option2"> Radio 2
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="option3"> Radio 3
</label>
</div>
</div>
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
<script src="../../transition.js"></script>
<script src="../../button.js"></script>
<!-- JavaScript Test -->
<script>
$(function () {
$('.js-loading-button').on('click', function () {
var btn = $(this).button('loading')
setTimeout(function (){
btn.button('reset')
}, 3000)
})
})
</script>
</body>
</html>