What is jic?

jic is a jquery plugin that makes simple to customize your checkbox and radio buttons by using images.

It works with all the major browsers including ie6 and with all the version of jquery between 1.2.3 and 1.6.4.

jic supports checkbox (multi-selection) and radiobox (mono-selection) and provides you 2 selection modes, so you can have maximum flexibility.

jic has a simple interface and some powerful options so you can customize the way it works. Let's have a look!

Suffix selection mode

This method is useful if you want to use a suffix in your images to mark the checked state of the checkbox.
For example you can have a myimage.png for not-checked state.
And a myimage_on.png for the checked state.

Once you choose your suffix, or use the default '_on', jic will do the dirty work for you, swaping the images according to the checkbox state.

Checkboxes in suffix-mode

Select/Deselect all

Radio in suffix-mode

Overlay selection mode

This method is useful if you don't want to provide an image for each state. So you have your set of images for the checkbox and you want to sign the checked state with css.

This is the css I use in the following examples

Checkbox in overlay-mode

Select/Deselect all

Radio in overlay-mode

People Images: digitalart / FreeDigitalPhotos.net