Controlling FONT Object Properties : Font « HTML « JavaScript DHTML






Controlling FONT Object Properties


/*
JavaScript Bible, Fourth Edition
by Danny Goodman 

Publisher: John Wiley & Sons CopyRight 2001
ISBN: 0764533428
*/

<HTML>
<HEAD>
<TITLE>FONT Object Properties</TITLE>
<SCRIPT LANGUAGE="JavaScript">
// document.all normalization trick for NN6
if (navigator.appName == "Netscape" && parseInt(navigator.appVersion) >= 5) { 
   document.all = document.getElementsByTagName("*") 
}
// one function does all!
function setFontAttr(select) {
    if (document.all && document.all.myFONT) {
        var choice = select.options[select.selectedIndex].value
        if (choice) {
            document.all.myFONT.setAttribute(select.name, choice)
        }
    }
}
</SCRIPT>
</HEAD>
<BODY>
<H1>Font Object Properties</H1>
<BR>
<P>This may look like a simple sentence, but 
<FONT ID="myFONT">THESE THREE WORDS</FONT> 
are contained by a FONT element.</P>
<FORM>
Select a text color: 
<SELECT NAME="color" onChange="setFontAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE="red">Red</OPTION>
    <OPTION VALUE="green">Green</OPTION>
    <OPTION VALUE="blue">Blue</OPTION>
    <OPTION VALUE="#FA8072">Some Hex Triplet Value</OPTION>
</SELECT>
<BR>
Select a font face: 
<SELECT NAME="face" onChange="setFontAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE="Helvetica">Helvetica</OPTION>
    <OPTION VALUE="Times">Times</OPTION>
    <OPTION VALUE="Comic Sans MS, sans-serif">Comic Sans MS, sans-serif</OPTION>
    <OPTION VALUE="Courier, monospace">Courier, monospace</OPTION>
    <OPTION VALUE="Zapf Dingbats, serif">Zapf Dingbats, serif</OPTION>
</SELECT>
<BR>
Select a font size: 
<SELECT NAME="size" onChange="setFontAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE="3">3 (Default)</OPTION>
    <OPTION VALUE="+1">Increase Default by 1</OPTION>
    <OPTION VALUE="-1">Decrease Default by 1</OPTION>
    <OPTION VALUE="1">Smallest</OPTION>
    <OPTION VALUE="7">Biggest</OPTION>
</SELECT>
</BODY>
</HTML>


           
       








Related examples in the same category

1.Font array and date
2.Change font size