Toggle Switch

Built by @jamiebicknell

This is a pure image based toggle switch powered by jQuery, using zero CSS3 properties and as a result it looks and functions the same in all browsers.

Option 1

Option 2

Option 3

Option 4

Option 5

Option 6

It utilises a semi transparent PNG overlay to mask the underneath switch image, so the toggling animation remains within the constraints of the rounded rectangle.

Features

Compatible in most browsers, including IE6+
Retina images for supporting iDevices
Uses semi-transparent PNG overlay, so will look the same in all browsers
PNG Overlay will need to be updated for use on different backgrounds (PSD Included for both regular and retina images)
Switch animates on click of the switch itself or the accompanying label