@@include('../layouts/head-page-meta.html', {'title': 'Bootstrap Switch'}) @@include('../layouts/head-css.html')
@@include('../layouts/layout-vertical.html')
@@include('../layouts/breadcrumb.html', {'breadcrumb-item': 'Forms', 'breadcrumb-item-active': 'Bootstrap Switch'})
@@include('../layouts/component/component-link.html',{ title:'Bootstrap Switch Button', text:'Bootstrap Switch Button is a widget that converts plain checkboxes into responsive switch buttons.', link:'https://gitbrent.github.io/bootstrap-switch-button/'})

##### Colors

Bootstrap Switch Button implements all standard bootstrap 4 button colors.

##### Dark Theme Colors

Bootstrap Switch Button colors look great on dark backgrounds.

##### Custom Text

The text can be changed easily with attributes or options.

##### HTML, Icons, Images

You can easily add icons or images since html is supported for on/off text.

##### Multiple Lines of Text

Toggles with multiple lines will adjust its heights.

##### Animation Speed

Transition speed can be easily controlled with css `transition` property on `.switch-group`. You can also turn animation off completely.

##### Stacked checkboxes

Simply add `data-toggle="switchbutton"` to convert checkboxes into toggles.
Enabled
Disabled

##### Event Propagation

Note All events are propagated to and from input element to the switch-button.

##### Methods

Methods can be used to control a switch button directly.

Method | Demo | Description
--- | --- | ---
initialize |  | Initializes the switch-button with options
destroy |  | Destroys the switch-button
on |  | Sets the switch-button to 'On' state
off |  | Sets the switch-button to 'Off' state
toggle |  | Toggles the state of the switch-button
enable |  | Enables the switch-button
disable |  | Disables the switch-button

@@include('../layouts/footer-block.html') @@include('../layouts/footer-js.html') @@include('../layouts/customizer.html')