JSFiddle - React, Tailwind, and code Playground

by rodrigonery

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="http://www.bootstrap-switch.org/static/js/bootstrap-switch.js"></script>
<link rel="stylesheet" href="http://bdmdesign.github.io/bootstrap-switch/static/stylesheets/flat-ui-fonts.css">
<div class="make-switch switch-large">
    <input type="checkbox" checked>
</div>
 
<div class="make-switch">
    <input type="checkbox" checked>
</div>
 
<div class="make-switch switch-small">
    <input type="checkbox" checked>
</div>
 
<div class="make-switch switch-mini">
    <input type="checkbox" checked>
</div>
 
<div id="dimension-switch" class="make-switch">
    <input type="checkbox" checked>
</div>

JavaScript

// Resets to the regular style
$('#dimension-switch').bootstrapSwitch('setSizeClass', '');
// Sets a mini switch
$('#dimension-switch').bootstrapSwitch('setSizeClass', 'switch-mini');
// Sets a small switch
$('#dimension-switch').bootstrapSwitch('setSizeClass', 'switch-small');
// Sets a large switch
$('#dimension-switch').bootstrapSwitch('setSizeClass', 'switch-large');