Help with getting fontSize on body tag

Discussion in 'Javascript' started by Adam Risser, Jun 8, 2007.

  1. Adam Risser

    Adam Risser Guest

    Hi, I am writing a function to change the font-size but I am running
    into a snag. I cannot get the current font-size of the body. Here is
    a link to a simplified test case

    http://mustang.millersville.edu/~wstudent/cewing/mu/test.php

    You would think that it would alert 72.5% when you click the resize
    button, but it alerts nothing. If i add the style to the body tag
    (style="font-size: 72.5%;" ), then it works.

    Here is the test case code:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
    www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <meta http-equiv="Content-type" content="text/html;
    charset=iso-8859-1" />
    <meta http-equiv="Content-Language" content="en-us" />
    <script type="text/javascript">

    function resizeText()
    {
    alert(document.getElementsByTagName('body')[0].style.fontSize);
    }

    </script>
    <style type="text/css">

    body {
    background: transparent url('../img/bg_pattern.gif') repeat 0 0;
    font-size: 72.5%;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif
    }

    </style>
    </head>
    <body>

    <p>Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test Test Test Test</p>

    <p>Text Resize&nbsp; <a href="#" id="grow"
    onclick="resizeText()">A<sup>+</sup></a> </p>

    </body>
    </html>

    Thanks in advance!
     
    Adam Risser, Jun 8, 2007
    #1
    1. Advertising

  2. Adam Risser wrote:
    > Hi, I am writing a function to change the font-size but I am running
    > into a snag. I cannot get the current font-size of the body. Here is
    > a link to a simplified test case
    >
    > http://mustang.millersville.edu/~wstudent/cewing/mu/test.php


    var body=document.body;
    var fs=
    (
    body.currentStyle||
    (window.getComputedStyle&&getComputedStyle(body,null))||
    body.style
    ).fontSize;
    alert(fs);
     
    scripts.contact, Jun 8, 2007
    #2
    1. Advertising

  3. Adam Risser

    Adam Risser Guest

    On Jun 8, 3:45 pm, "scripts.contact" <>
    wrote:
    > Adam Risser wrote:
    > > Hi, I am writing a function to change the font-size but I am running
    > > into a snag. I cannot get the current font-size of the body. Here is
    > > a link to a simplified test case

    >
    > >http://mustang.millersville.edu/~wstudent/cewing/mu/test.php

    >
    > var body=document.body;
    > var fs=
    > (
    > body.currentStyle||
    > (window.getComputedStyle&&getComputedStyle(body,null))||
    > body.style
    > ).fontSize;
    > alert(fs);



    Thank you for your help. When I put that in an onload function, it
    returns the size in pixels.
    I am looking hopefully to just return whatever font-size is set in the
    css. (In this case, 72.5%)

    I have no real idea how that snippet works, but it is interesting :p
    Thanks again!
     
    Adam Risser, Jun 8, 2007
    #3
  4. Adam Risser

    rf Guest

    "Adam Risser" <> wrote in message
    news:...

    > Hi, I am writing a function to change the font-size


    Ctrl mouse wheel?

    --
    Richard.
     
    rf, Jun 9, 2007
    #4
  5. Adam Risser

    Adam Risser Guest

    On Jun 8, 11:02 pm, "rf" <> wrote:
    > "Adam Risser" <> wrote in message
    >
    > news:...
    >
    > > Hi, I am writing a function to change the font-size

    >
    > Ctrl mouse wheel?
    >
    > --
    > Richard.


    I am looking to have A+ and A- buttons on the site so people can
    change the font who do not know about Ctrl mouse wheel
     
    Adam Risser, Jun 13, 2007
    #5
  6. Adam Risser

    Guest

    On Jun 8, 3:55 pm, Adam Risser <> wrote:
    > On Jun 8, 3:45 pm, "scripts.contact" <>
    > wrote:
    >
    > > Adam Risser wrote:
    > > > Hi, I am writing a function to change the font-size but I am running
    > > > into a snag. I cannot get the current font-size of the body. Here is
    > > > a link to a simplified test case

    >
    > > >http://mustang.millersville.edu/~wstudent/cewing/mu/test.php

    >
    > > var body=document.body;
    > > var fs=
    > > (
    > > body.currentStyle||
    > > (window.getComputedStyle&&getComputedStyle(body,null))||
    > > body.style
    > > ).fontSize;
    > > alert(fs);

    >
    > Thank you for your help. When I put that in an onload function, it
    > returns the size in pixels.
    > I am looking hopefully to just return whatever font-size is set in the
    > css. (In this case, 72.5%)
    >
    > I have no real idea how that snippet works, but it is interesting :p
    > Thanks again!


    No dice unless you use an inline style attribute on the body tag (not
    a good idea.) Regardless, this is a waste of time; leave the font
    sizing to the user agent.
     
    , Jun 20, 2007
    #6
  7. Adam Risser

    RobG Guest

    On Jun 13, 10:27 pm, Adam Risser <> wrote:
    > On Jun 8, 11:02 pm, "rf" <> wrote:
    >
    > > "Adam Risser" <> wrote in message

    >
    > >news:...

    >
    > > > Hi, I am writing a function to change the font-size

    >
    > > Ctrl mouse wheel?

    >
    > > --
    > > Richard.

    >
    > I am looking to have A+ and A- buttons on the site so people can
    > change the font who do not know about Ctrl mouse wheel


    Most will tell not to try, users can change the font size themselves a
    number of ways. On a 33cm screen at 1280x800px I have the default
    font set to 18pt, on a 48cm screen at 1280x1024px I have it set to
    14pt. I can use ctrl+"plus" to make it bigger at any time I like, ctrl
    +"minus" to make it smaller.

    But since you wont heed that advice, use CSS and modify a style rule
    that sets the body's font size in percentage. Some browsers will
    report the font size in whatever units were used to set it, others
    will report in whatever unit they wish, regardles of what was used to
    set it. You will need to test thoroughly.


    --
    Rob
     
    RobG, Jun 20, 2007
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. =?Utf-8?B?ZnJlZA==?=

    fontsize/stylesheet problem

    =?Utf-8?B?ZnJlZA==?=, Jun 9, 2004, in forum: ASP .Net
    Replies:
    0
    Views:
    451
    =?Utf-8?B?ZnJlZA==?=
    Jun 9, 2004
  2. Veeresh

    HTML Literal Control & FontSize

    Veeresh, Jun 28, 2004, in forum: ASP .Net
    Replies:
    2
    Views:
    4,401
    Veeresh
    Jun 28, 2004
  3. shruds
    Replies:
    1
    Views:
    960
    John C. Bollinger
    Jan 27, 2006
  4. Replies:
    1
    Views:
    141
  5. jnag
    Replies:
    4
    Views:
    259
Loading...

Share This Page