O'Reilly logo

iPhone JavaScript Cookbook by Arturo Fernandez Montoro

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating the toggle buttons

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.

Getting ready

As in the previous recipe, we're following with the iUI framework for this recipe.

How to do it...

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> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required