15 October 2006
Styled Checkboxes and Styled Radio Buttons
Posted by Mikhail Esteves under: Random Websites .
To solve the javascript issue the styled form controls needed to be dynamically inserted into the page using a javascript. No javascript, no change. Original experiments with
innerHTMLandregExpfailed miserably and proved inelegant. However I am still usinginnerHTMLto produce the styled buttons in Internet Explorer.To solve the CSS problem the styled form controls needed to be invisible with CSS disabled, and likewise the unstyled controls needed to be visible. This was achieved by hiding the unstyled controls with CSS and using a plain Anchor with background images to act as the new control.
To solve the accessibility issues the Anchor comes into play once more. Because it is an Anchor it can be tabbed into and manipulated with keyboard commands and/or clicked.
90% of the code bulk is shoved aside into a javascript, with only well-formed XHTML and wrapping span tags with specific classes assigned to mark up the fields we want styled.
