[Javascript] Javascript fontsize control from external page

Barry Conner BConner at huntsvilletx.gov
Mon Oct 2 09:08:36 CDT 2006


QUESTION:
 
How can an external page using Javascript be used to change font sizes on the primary page?
 
I have a FRAMES webpage into which I've designed a control bar.  This control bar appears as a "header" frame, and includes controls to modify font sizes to suit the user's preference.  It works fine, except that the only font size it will change is on the control bar itself !!!  I need to know how to make this Javascript act upon the primary page within my frames page.  
 
I'm appending the code from the control bar to this email.  It may be pretty sloppy, but I'm a novice.
 
Here's the code:
 
<!DOCTYPE html
     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd <http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd> ">
<html>
<head>
     <title>Asbuilt_Suite_Control_Bar</title>
     <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
     <meta content="mshtml 6.00.2900.2627" name="generator" />
     <base target="main_content" />
<style type="text/css">
body{
     background-color:"rgb(204,204,208)"
     }
     a:link{color:darkred}
     a:visited{color:darkred}
     a:active{color:red}
p {
font-family:"Verdana";
font-size: 16pt;
color: #ffffff;
font-weight:normal}

font{
font-family: verdana;
font-size: 10pt;
color: rgb(42,0,171);
font-weight:normal}
ul{
font-family: verdana;
font-size: 8pt;
color: rgb(42,0,171);
font-weight:normal}
</style>

  <link rel="stylesheet" href="../_library/_scripts/style.css" type="text/css" />
  <link rel="alternate stylesheet" type="text/css" href="../_library/_scripts/large.css" title="A++" />
  <link rel="alternate stylesheet" type="text/css" href="../_library/_scripts/medium.css" title="A+" />
  <link rel="alternate stylesheet" type="text/css" href="../_library/_scripts/small.css" title="A" />
  <link rel="alternate stylesheet" type="text/css" href="../_library/_scripts/x-small.css" title="A-" />
  <link rel="alternate stylesheet" type="text/css" href="../_library/_scripts/xx-small.css" title="A--" />

<script
  language="JavaScript1.2"
  src="../_library/_scripts/styleswitcher.js"
  type="text/javascript">
</script>
 
</head>
<body bgcolor="rgb(204,204,208)">
     <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
<form name="font_select" action="GET">
     <table align="center" width="100%" cellspacing="0" cellpadding="4" rules="cols" frame="below" border="0"
     bgcolor="rgb(152,170,186)"
     style="font-color:'rgb(42,0,171)'" >
          <tr>
               <td width="25%">
                    <strong>
                    View Control:
                    </strong>
               </td>
               <td align="center">
                    <button type="button" onclick="javascript:history.back()"><small>&nbsp;&nbsp;Back&nbsp;&nbsp;</small></button>
               </td>
               <td align="center">
                    <button type="button" onclick="javascript:history.forward()"><small>Forward</small></button>
               </td>
               <td align="center">
                    <button type="button" onclick="javascript:fontsizedown();"
                    value=" font - " >
                    <small>Smaller Font</small></button>
               </td>
               <td align="center">
                    <button type="button" onclick="javascript:fontsizereset()" >
                    <small>&nbsp;Reset Font&nbsp;</small></button>
               </td>
               <td align="center">
                    <button type="button" onclick="javascript:fontsizeup();"
                    value=" font + " >
                    <small>&nbsp;Larger Font&nbsp;</small></button>
               </td>
          </tr>
     </table>
</form>
 <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
</body>
</html>

-------------- next part --------------
A non-text attachment was scrubbed...
Name: not available
Type: application/ms-tnef
Size: 10043 bytes
Desc: not available
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20061002/e74d11da/attachment.bin>


More information about the Javascript mailing list