Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Sep 2005
    Posts
    23
    Thanks
    11
    Thanked 0 Times in 0 Posts

    Zoom in/out website content

    I'm searching for a crossbrowser script to zoom in/out the full website content (not text only). Who can provide me a link to that kind of script?

  • #2
    Regular Coder
    Join Date
    Jan 2008
    Location
    Geneva, Switzerland
    Posts
    413
    Thanks
    12
    Thanked 29 Times in 29 Posts
    Ctrl+(+) / Ctrl+(-) ?

    Most good browsers do that today. And I can't think of any script that would do that.
    Chuck Norris counted to infinity.
    Twice.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,142
    Thanks
    203
    Thanked 2,547 Times in 2,525 Posts
    JavaScript has no capability to access the client's operating system or the Windows registry, or alter the default behaviour of the browser.

    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #4
    Regular Coder
    Join Date
    Jan 2008
    Location
    Geneva, Switzerland
    Posts
    413
    Thanks
    12
    Thanked 29 Times in 29 Posts
    I wasn't suggesting to write a script that would control your browser's builtin functionalities (since you can't, as pointed out). I was just trying to say that since you can do it natively on your browser, I would see no point to create a script that would do the same...
    Chuck Norris counted to infinity.
    Twice.

  • #5
    New Coder
    Join Date
    Sep 2005
    Posts
    23
    Thanks
    11
    Thanked 0 Times in 0 Posts
    I have scripts for text to zoom in/out, scripts for images to zoom in/out and a script that does both, but this is IE only. I 'm looking for a crossbrowser script for my visitors with poor eyesight who like the 'document.body.style.zoom' effect in IE and ask me why this is not working in other browsers: not everybody has a system that can work with Windows 8 and IE9, even my system is not performant enough to work with IE7.

  • #6
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    You really can't do this. IE is the only one who supports that method (as you know) and there is no direct way to duplicate the effect. Probably the best you can do is try to roughly fake it.

    Option 1 (seems like it *should* work):

    Get the computed height, width, font-size, line-height, and anything else you may need from every element in the page and then proportionally increase each of them. This would take looping and would be a real pain in the bum, but it seems like it ought to work in theory. Good luck with margins, though . Even so, this might crash a browser or two even if you got an implementation of it working. Wouldn't know until you tried, though. Right?!

    Option 2 (will work, but requires sacrifice):

    Set up your page style (element heights, widths, borders, etc.) with "%" units rather than "px" or "pt" or "em" units. Then change the body element's height/width settings directly (use "px" here, if you like) and the rest of the page should adjust accordingly.

    Same with text. Set up your font styles with "em" or "%" units rather than "px" or "pt" units. Change your body element's font-size setting and watch the whole page's text get larger/smaller as adjusted, but still keep it's size ratio the same...

    Implement the body's height/width and font-size style change via javascript and you're done.

    It's going to be waaaaaay messy to do though and you'll lose a lot of the "fine" control over your page layout, but you can very roughly create a similar effect that way.

    Personally, I'd skip it.
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. –G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting

  • Users who have thanked Rowsdower! for this post:

    skynet (12-16-2011)

  • #7
    New Coder
    Join Date
    Sep 2005
    Posts
    23
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Even old IE browsers can do this, why can't 'modern' browsers do the same ?
    I know I'm stubborn, but I'll keep on trying until I find a working solution: I already succeeded before in doing 'impossible' things.

  • #8
    Gütkodierer
    Join Date
    Apr 2009
    Posts
    2,127
    Thanks
    1
    Thanked 426 Times in 424 Posts
    Quote Originally Posted by skynet View Post
    Even old IE browsers can do this, why can't 'modern' browsers do the same ?
    Because it's not part of any standard specification. The times when browser vendors implemented random APIs on a whimsy are over, and that's a good thing.

    Quote Originally Posted by skynet View Post
    I know I'm stubborn, but I'll keep on trying until I find a working solution: I already succeeded before in doing 'impossible' things.
    While you might succeed, you probably shouldn't. It's not the website's job to provide its own accessibility tools. It's the website's job to adhere to standards and best practices, so it will work with accessibility tools your visitors with bad eyesight are probably already using (so providing an additional accessibility gimmick won't do much good).

    If, for some reason, they are not, they will generally have a bad experience on the web, and if you suspect that your target audience includes a more than average number of people with bad eyesight, it might be a good idea to point them to available accessibility tools, which would improve their whole web experience, instead of providing some gimmick that might improve their experience on your website.
    .My new Javascript tutorial site: http://reallifejs.com/
    .Latest article: Calculators — Tiny jQuery calculator, Full-fledged OOP calculator, Big number calculator
    .Latest quick-bit: Including jQuery — Environment-aware minification and CDNs with local fallback


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •