Android Style Toggle Switch In CSS – togglebtn.css

Category: CSS & CSS3 , Form | December 8, 2021
Author:cailyn-baksh
Views Total:313 views
Official Page:Go to website
Last Update:December 8, 2021
License:MIT

Preview:

Android Style Toggle Switch In CSS – togglebtn.css

Description:

togglebtn.css is a CSS library for creating Android-style toggle switches using pure CSS.

How to use it:

1. Load the togglebtn.css stylesheet in the document.

<link href="togglebtn.css" rel="stylesheet" />

2. The markup to create a basic toggle switch.

<input type="checkbox" id="demo1" class="togglebtn" autocomplete="off" />
<label for="demo1" class="togglebtn"><span class="indicator"></span></label>

3. Create a toggle switch with conditional label.

<input type="checkbox" id="demo2" class="togglebtn" autocomplete="off" />
<label for="demo2" class="togglebtn conditional"><span class="indicator"></span></label>
<label for="demo2" class="conditional on">Leat Fingies</label>
<label for="demo2" class="conditional off">Bimgus</label>

You Might Be Interested In:


Leave a Reply