开发者

force webpage to open in 100% zoom (in IE8)

开发者 https://www.devze.com 2023-02-05 17:53 出处:网络
I have a website which works well with any zoom on FireFox/Chrome/Opera/Safari... but on Internet Explorer the site looks good only with 100% zoom. in IE7 the default zoom is 100%, but in IE8 the defa

I have a website which works well with any zoom on FireFox/Chrome/Opera/Safari... but on Internet Explorer the site looks good only with 100% zoom. in IE7 the default zoom is 100%, but in IE8 the default zoom is开发者_JS百科 125%, so if you are using IE8 you need to press ctrl+0. I have used PIE.htc from http://www.css3pie.com for support CSS3 on IE.

Is there any JavaScript code or meta tag that controls the view size? I'll use it for IE only, of course.


No, this isn't possible. User preferences are up to the user, and even if you could find a way around it, you shouldn't.

It is up to the user to decide how they want their pages zoomed, not you. Keep in mind, this is often due to folks that can't see well (or can barely see at all), and they're much more interested in being able to read a page than how good your scaled graphics look.


http://msdn.microsoft.com/en-us/library/ms531189(v=vs.85).aspx

"Windows Internet Explorer 8. The -ms-zoom attribute is an extension to CSS, and can be used as a synonym for zoom in IE8 mode."

Having said that, I haven't tried it to know how it behaves, and you shouldn't force a particular size on a user (as @Brad stated).

All modern browsers do a nice job of scaling things smoothly both up and down, so I wouldn't worry about it too much.

EDIT: your site looks fine in Chrome and IE8 on my machine (in which it opens at 100% on my machine anyway, so check your browser settings. This whole discussion may be moot).


  1. It works on Chrome

    <script>
        document.firstElementChild.style.zoom = "reset";
    </script>
    
  2. With this I prevent the user to zoom in on the page

    <script>
        $(document).ready(function () {
            $(document).keydown(function (event) {
                if (event.ctrlKey == true && (event.which == '107' || event.which == '109' || event.which == '187' || event.which == '189')) {
                    event.preventDefault();
                }
            });
    
            $(window).bind('mousewheel DOMMouseScroll', function (event) {
                if (event.ctrlKey == true) {
                    event.preventDefault();
                }
            });
        })
    </script>
    


Thanks to Brad and to Tim Medora.
I think the "-ms-zoom" property was helpful.

Apple developed a good solution for Safari on iPhone and iPod :

<meta name="viewport" content="initial-scale=1.0 , minimum-scale=0.5 , maximum-scale=1.5" />

see details here.

Mobile Firefox supports this meta tag too.
Also, this tag could be useful to desktop browsers, but they don't support it yet.

0

精彩评论

暂无评论...
验证码 换一张
取 消