A CodePen by Jed Foster. CSS toggle (0% - 100% width slide)  - Mimic the ON/OFF toggle control from iOS. 

This version transitions the width of each state (ON/OFF) from 0% to their full width, as opposed to sliding them left and right across the controls "viewport". 
This allows you have a different color background for each state, but does not imitate the iOS effect of states existing under the control viewport, rather, each state scales horizontally during the transition at a different perceived rate that the "knob". However, this version does avoid the Webkit clipping bug that would otherwise briefly show color outside the rounded corners of the control.