Need of a text resize script

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • mikek12004
    New Member
    • Sep 2008
    • 200
    #1

    Need of a text resize script

    In a page with fonts with different sizes I want to have to links in order to be the user able to make the letter larger (for people with viewing difficulties),
    a)One noce solution is the zoom function of the explorer (the magnifier glass at the bottom right of the window) is there any such command in javascript?

    b) On another solution, I have found this script
    Dynamic Drive DHTML Scripts- Document Text Sizer
    which appears to be fine but it resizes all letters to the same size (regardless of being small or big) anyway to modidy the .js so that the proportion be kept?
    Tags: None
    • clain
      New Member
      • Feb 2007
      • 79
      #2
      pretty had task.. though...!! one alternative is to have an id for the text you have to modify... and use javascript to modify the size... else you need to increase all the fonts by applying the size increment for body...

      enjoy

        Comment

        • rnd me
          Recognized Expert Contributor
          • Jun 2007
          • 427
          #3
          if you use percents to define your font sizes. setting document.body.s tyle.fontSize should globally increase/decrease font size.

            Comment

            • mikek12004
              New Member
              • Sep 2008
              • 200
              #4
              ctrl+ and ctrl- and ctrl0 are shortcuts working in any browser which do just that (no need reinventing the wheel), any way I can get them to work by pressing a button in my page (instead of pressing them in the keyboard)

                Comment

                • gits
                  Recognized Expert Moderator Expert
                  • May 2007
                  • 5390
                  #5
                  unfortunatly there's no standard way to call the text-zoom that the browsers provide ... but here is another simple example that you could test in firefox that will basicly may be of help:

                  [code=html]
                  <html>
                  <head>

                  <script type="text/javascript">
                  function increase_txt_si ze() {
                  var b = document.getEle mentsByTagName( 'body')[0];
                  b.style.fontSiz e = get_font_size(b ) + 5 + 'px';
                  }

                  function decrease_txt_si ze() {
                  var b = document.getEle mentsByTagName( 'body')[0];
                  b.style.fontSiz e = get_font_size(b ) - 5 + 'px';
                  }

                  function get_font_size(n ode) {
                  var f_size = window.getCompu tedStyle(node, null).fontSize. match(/(\d+)/)[1];
                  return parseInt(f_size , 10);
                  }
                  </script>

                  </head>
                  <body>
                  foo<br/>
                  <input type="button" value="bigger_t xt" onclick="increa se_txt_size();"/>
                  <input type="button" value="smaller_ txt" onclick="decrea se_txt_size();"/>
                  </body>
                  </html>
                  [/code]
                  kind regards

                    Comment

                    Previous template Next
                    Working...