Follow @magnawebstudio on Twitter Follow @magnawebstudio on Twitter
Follow /magnawebstudio on LinkedIn Follow /magnawebstudio on LinkedIn
awarded site
magna web studio
Contact us! Contact us!
WB-Developers' Corner
WB-Developers' Corner
       [rz] Check-n-Radio Beautifier

This lightweight extension allows you to visually enhance the checkbox and radioubutton form objects.

Some features:

- Keyboard, mouse and touch handled.
- RWD support.
- Smooth effect.
- Colors and shadows for both 3D and flat effects with styled focus handling.
- Flexible, versatile and very easy to implement.
- Maximum backward, cross-browser and cross-platform compatibility.
- Unobstrusive, lightweight, no dependencies, no jQuery.
- Supports multi-instances; you can have different grouped fields with their own colors/settings.

...and more!

HTML 4.01 Transitional
W3C compliant


* Just a brief about some of the changes that were made lately...

* New in version 1.2

- Improved mouse cursor handling.
- Improved behavior to mimic its behavior as in the default system elements.
- More efficient code.

* New in version

- Improved alignment on fluid/dynamic scenarios.
- Improved mouse cursor to mimic as close as posible the system defaults.

* New in version 1.1

- Added support for labels (with explicit or implicit references).
- Improved group handling.
- Detects cached values on page refresh (some browsers do not clear the field values).
- Custom offsets for specific design adjustments.
- Custom sizes.
- Custom space around the main element and the focus element.
- Extended width options.
- Improved code.
- External access to force the instance to re-replace elements (useful for advanced and complex designs).
  New available function: MyInstance.refresh(); (replace MyInstance with the actual instance name.)

* New in version 1.0.2

- The core has been moved to an external file for a faster navigation between pages.
- Minor code optimizations.

* New in version 1.0.1

- Improved navigability/interactivity standards emulation.
- Fixed a sporadic startup/refresh issue on specific schemes
  (like an instance without the use of a form or initially hidden holder).

How to use?

1. Design your form as you usually do (with checkboxes and/or radiobuttons).
2. Drag and drop the extension into the workspace.
3. Open its properties dialog and enter the group name (the name property that is the same for the
    grouped elements).
4. Setup the colors and all the appearance of the replacement control (or leave them as by default).
5. Repeat from #2 in case that you need to setup a different grouped colors.
6. Preview or publish (remember: to send messages -depending on your settings- you may need php!).

Available custom functions:

MyInstance.refresh(); force the instance to re-replace elements (useful for advanced and complex designs).

(Replace 'MyInstance' with the actual instance name.)

w3c compliant
© 2012-20 by MAGNA web studio • all rights reserved

new shop with