Proof of Concept

Yeah, sure. It's probably been done before. But it's more fun when you do it yourself... from scratch.

So, here's the deal. We're using links with an onClick event to toggle the state of a set of radio buttons named toggleMe.

On / Off / Half-On / Half-Off


On Off Half-On Half-Off

Another tactic

Using the fact that label elements can "capture" events and apply them to the associated element, we can hide the input elements and use the labels instead. Since this is a Proof of Concept, we're going to "tie" the label to the id of the radio buttons so that the labels can catch events.

Next step is to write the js function that doesn't require a copious number of onchange handlers to modify the class of the labels.


Return to the Toxic Wombat Home Page