Link to home
Start Free TrialLog in
Avatar of jhint
jhint

asked on

Changing font size in browser

How do you create text on the web page that can be changed in size by the viewer in his browser by using his change size button?

Simple text I create in Frontpage and Word XP doesn't seem to allow this to happen. It just stays the size set when authored.
ASKER CERTIFIED SOLUTION
Avatar of avner
avner

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of avner
avner

It depends on the code. FrontPage and word generates a code with CSS font-size defines. if you remove all the font settings (font-size, or font) you will then be able to change the font size with the browser charachter settings.
You can of course provide different CSS stylesheets (with small, medium and large font sizes) and switch between them using a JavaScript function that is activated by a click of a button that JS displays on each page.

I find this very useful for group training events (small for printing, medium for individual PC screens, large for whole-group data projector).

This approach is more work but gives you MUCH more control of the displays NOT just font-size.

<script language="JavaScript">
document.write('<form><input type=button name=changeSize value="Change text size" onClick="cycleCSS()"></form>');

function cycleCSS() {
   currentCSS=document.styleSheets[0].href;
   if (currentCSS=='small.css') {
      document.styleSheets[0].href='medium.css'
      document.forms[0].changeSize.value='Medium --> Large text';
   }
   if (currentCSS=='medium.css') {
      document.styleSheets[0].href='large.css'
      document.forms[0].changeSize.value='Large --> Small text';
   }
   if (currentCSS=='large.css') {
      document.styleSheets[0].href='small.css';
      document.forms[0].changeSize.value='Small --> Medium text';
   }
}
</script>

See URL below for example of use:

http://www.active-media-solutions.co.uk/international/listitems2.asp


HTH
Avatar of jhint

ASKER

Thanks. I now have to ask another question. Perhaps it should be a new entry in the system or just an extentsion to this question. But in any case - how do I rid my web page of style sheet code?  I tried the Remove formatting options in Word and Frontpage but they didn't work.  For some reason they don't seem to regard style sheets as formatting?!?!!?

I hope I don't have to do it manually.  Can I set the programs to NOT insert style sheet codes in the first place?
I am not familier with FrontPage and therefore cannot answer, sorry.