A toggle button allows you to choose between two possible states or values. The most common use of this widget is for actions or properties, whose value can be On or Off. The value can be changed by clicking on the button. It detects the event and automatically changes the value from one to the other.
As in the previous recipe, we're following with the iUI framework for this recipe.
Open the file you've created for the previous recipe with a text editor. We only use one row for the panel, so you can delete the other two rows. After the label tag for the one and only row, we'll add the following code:
<div class="toggle" onclick="return;"> <span class="thumb"></span> <span class="toggleOn">On</span> ...