Controlling or Excluding from Text Size Change
This page implements the FontSizer Code in such a way that almost all page elements participate in the text size adjustment while a few are either restricted or excluded. Try the adjustment links on the right to see the effect.
See below for more information about other implementations of this very flexible code.
Instructions and Information
The Documentation provides the basic instructions for setup of the code. This example demonstrates the invocation of the setDefaults and set methods to specify that most page elements can participate in the resize with a few restricted or excluded.
In the current document, which has most page elements' font-size set using relative units of measurement, this is accomplished with use of the setDefaults and set methods as follows:
dw_fontSizerDX.setDefaults( 'px', 13, 9, 23, ['body'] ); // default size, min, max, selector(s) dw_fontSizerDX.set(12, 9, 16, ['div#sidebar'] ); dw_fontSizerDX.set(12, 10, 16, ['pre']) dw_fontSizerDX.set(26, 26, 26, ['div#logo span'] ); dw_fontSizerDX.set(11, 11, 11, ['div#copyright span'] );
If you are specifying font-sizes on many elements (with or without classes or id's)[1] using pixels, points are other absolute units of measurement, you could achieve this effect by including more element selectors in setDefaults:
dw_fontSizerDX.setDefaults( 'px', 13, 9, 23, ['body','td','p','div','span'] );
More Information
The FontSize Change JavaScript is very flexible and able to work with style sheets set up any number of ways. The Documentation provides details and points to examples demonstrating the code's flexibility. Basic example documents in the download file will assist you in implementing the code to suit your purposes.
See Licensing Information for use of the code. Please read dyn-web's Terms of Use if you plan to use our code.
- As noted in the documentation since the code in effect applies inline styles these override style sheet specifications which would otherwise be more specific. ^