Change Text Size OnClick
Provide visitors to your site the the option of increasing or decreasing the size of text onclick of image or text links using JavaScript. This code provides that option yet allows you, the page designer, to control which portions of your layout can have text size adjusted and how much.
The code can be set up very simply with the inclusion of lightweight external JavaScript files, placement of a div to contain the size change links and a call to an initialization function. You can place more precise control on the code's operations with the use of simple set methods.
Basic instructions, examples and documentation guide you in the use of the code to suit your purposes. A download file contains the code and examples. See also purchase information and dyn-web's Term of Use.
Benefits of this Code
Font-size change JavaScript code provides a uniform, readily available means of adjusting text size rather than expecting users to find the varying browser provided mechanisms for doing so. It allows a much wider range of font-size increase and decrease than the View Text Size menu commands in Internet Explorer. The code allows size adjustment for Internet Explorer if you use pixels or points to specify font-size as well as em's, percentages or keywords.
The code available here also offers you more control over the text zoom process, by providing the means to exclude some page elements from being resized and restricting the size-range of others. Of course, users can still access the browser provided means of changing text size if they desire. This code in no way impedes that.
Once the user has clicked a button to choose a text size, their size preference will be held in a cookie for future visits to the site or visits to other pages in the site that use the code. Text size can be preselected for users with particular needs and passed in the URL.
The code is object-based, which greatly reduces the potential for conflict with other code in your documents. Event handling is set up unobtrusively (i.e., no event handler attributes in HTML elements) and can work with keyboard activation of the links as well as onclick.
Browser Support
The code can be expected to work in browsers that support getElementById, getElementsByTagName, and style object manipulation, i.e., the vast majority of browsers in use today. Object detection is used so future standards compliant browsers should easily be supported as well. It has been successfully tested on Internet Explorer 5+, Firefox, Safari and Opera.
Proceed to the documentation which includes basic instructions and examples to demonstrate and guide you in the use of the code to suit your purposes. A download file contains the code and examples. See also purchase information and dyn-web's Term of Use.