如何在ipad中调整/重新缩放网页 [英] how to resize / rezoom webpage in ipad

问题描述

我有一个网站，它使用jquery mobile为它的移动版本。我有一个问题，当我将它从纵向更改为横向时，它可以正确放大，但是当我翻转到纵向时，它保持相同的缩放级别，并且比打破用户体验的视图更宽。
我使用常规：

I have a website that uses jquery mobile for it's mobile version. I have a problem when I am changing it from portrait to landscape it zooms in correctly, but when I flip to portrait, it stays same zoom level and is wider then the view which breaks user experience. I use regular:

<meta name="viewport" content="width=device-width, initial-scale=1">

从我所做的所有搜索，这应该做。不幸的是，它不适合我。

from all the search I did, this should do. Unfortunately it isn't working for me.

这是我的问题，我可以使用onorientationchange事件来触发页面的大小调整，我只是不确定如何去做。你能帮忙吗？

Here is my question, I can use onorientationchange event to trigger resizing of the page, I am just not sure how to go about it. Can you help please?

P.S。网站在这里，如果你想偷看 http://tmg.dev.dakic.com/mobile

P.S. website is here if you would like to take a peek http://tmg.dev.dakic.com/mobile

谢谢你，
Zeljko

Thank you, Zeljko

推荐答案

试试这个，我遇到了类似的问题：

Try this, I had a similar issue:

    $(window).bind('orientationchange', function(event) {
    if (window.orientation == 90 || window.orientation == -90 || window.orientation == 270) {
        $('meta[name="viewport"]').attr('content', 'height=device-width,width=device-height,initial-scale=1.0,maximum-scale=1.0');
        $(window).resize();
        $('meta[name="viewport"]').attr('content', 'height=device-width,width=device-height,initial-scale=1.0,maximum-scale=2.0');
        $(window).resize();
    } else {
        $('meta[name="viewport"]').attr('content', 'height=device-height,width=device-width,initial-scale=1.0,maximum-scale=1.0');
        $(window).resize();
        $('meta[name="viewport"]').attr('content', 'height=device-height,width=device-width,initial-scale=1.0,maximum-scale=2.0');
        $(window).resize();
    }
    }).trigger('orientationchange');  

在某些事件中尝试使用resize（）函数：

Try otherwise using the resize() function at certain events:

 $(window).resize();

这篇关于如何在ipad中调整/重新缩放网页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！