Question

可能重复：
How do I lock the orientation to portrait mode in a iPhone Web Application?

我努力锁定webapp的方向。例如，希望网站永久处于方向视图中。

建议赞赏。

Answer 1

我创建了函数keep，它将您想要保留的方向作为参数（90/180 / -90 / 0）：

function keep(nbre)
{
    var preventer,deviceW=screen.width,deviceH=screen.height;
    function set()//I put all the content of the body in a container named 'preventer' so that I can turn it (I can't turn the <body>)
    {
        var body=document.getElementsByTagName("body")[0];
        preventer=document.createElement("div");
        preventer.innerHTML=body.innerHTML;
        preventer.style.position="absolute";
        body.innerHTML="";
        modify();
        document.body.appendChild(preventer);
    }
    function modify()
    {
        function sign(x,y){return(x>0?1:(x<0?-1:y));}//Return the sign or y if 0
        window.scrollTo(0,0);
        var o=window.orientation,width,height,transformorigin,transform="rotate(",top,left;
        if(!(nbre%180))//Multiple of 180 : 180, 360...
        {
            if(!(o%180))//Also multiple of 180
            {
                width=deviceW;//Width and height ar those of the device
                height=deviceH-20;//-20 because of the status bar
            }
            else
            {
                width=deviceW-20;
                height=deviceH;
            }
        }
        else
        {
            if(!(o%180))
            {
                width=deviceH-20;
                heigth=deviceW;
            }
            else
            {
                width=deviceH;
                height=deviceW-20;
            }
        }
        if(Math.abs(nbre%180)==Math.abs(o%180))//If it's 90 and 90 or 90 and -90 or 180 and 180...
        {
            transformorigin="50% 50%";//The origin of rotation must be the center of the div
        }
        else
        {
            transformorigin="0px 0px";
        }

        if(!nbre)//0
        {
            if(!(o%180))//180, 360...
            {
                transform=o;
            }
            else
            {
                transform=-o;
            }
        }
        else
        {
            if(nbre==90)
            {
                transform=o-(o*2-90);//0=>90 90=>0 180=>-90 -90=>180
            }
            else
            {
                if(nbre==-90)
                {
                    if(sign(o,-1)==-1)
                    {
                        transform=o-sign(o,1)*90;
                    }
                    else
                    {
                        transform=o-180+sign(o-180,1)*90;
                    }
                }
                else
                {
                    if(!(o%180))
                    {
                        transform=o-sign(o,-1)*180;
                    }
                    else
                    {
                        transform=o;
                    }
                }
            }
        }
        transform+="deg)";

        if(Math.abs(nbre)%180==Math.abs(o)%180)
        {
            top=0;
            left=0;
        }
        else
        {
            if(nbre==0&&o==90||nbre==180&&o==-90)
            {
                top=deviceW-20;
                left=0;
            }
            else
            {
                if(nbre==0&&o==-90||nbre==180&&o==90)
                {
                    top=0;
                    left=deviceH;
                }
                else
                {
                    if(nbre==-90&&o==0||nbre==90&&o==180)
                    {
                        top=deviceH-20;
                        left=0;
                    }
                    else
                    {
                        top=0;
                        left=deviceW;
                    }
                }
            }
        }
        preventer.style.webkitTransform=transform;
        preventer.style.webkitTransformOrigin=transformorigin;
        preventer.style.width=width+"px";
        preventer.style.height=height+"px";
        preventer.style.top=top+"px";
        preventer.style.left=left+"px";
    }
    window.addEventListener("orientationchange",modify,false);
    window.addEventListener("load",set,false);
}

这是一个较小的版本：

function keep(nbre)
{
    var preventer,deviceW=screen.width,deviceH=screen.height;
    function set()
    {
        var body=document.getElementsByTagName("body")[0];
        preventer=document.createElement("div");
        preventer.innerHTML=body.innerHTML;
        preventer.style.position="absolute";
        body.innerHTML="";
        modify();
        document.body.appendChild(preventer);
    }
    function modify()
    {
        function sign(x,y){return(x>0?1:(x<0?-1:y));}
        window.scrollTo(0,0);
        var o=window.orientation,s=!(nbre%180)?(!(o%180)?[deviceW,deviceH-20]:[deviceW-20,deviceH]):(!(o%180)?[deviceH-20,deviceW]:[deviceH,deviceW-20]),t=[Math.abs(nbre%180)==Math.abs(o%180)?"50% 50%":"0px 0px","rotate("+(!nbre?(!(o%180)?o:-o):((nbre==90)?o-(o*2-90):((nbre==-90)?(sign(o,-1)==-1?o-sign(o,1)*90:o-180+sign(o-180,1)*90):(!(o%180)?o-sign(o,-1)*180:o))))+"deg)"],p=Math.abs(nbre)%180==Math.abs(o)%180?[0,0]:(nbre==0&&o==90||nbre==180&&o==-90?[deviceW-20,0]:(nbre==0&&o==-90||nbre==180&&o==90?[0,deviceH]:(nbre==-90&&o==0||nbre==90&&o==180?[deviceH-20,0]:[0,deviceW])));
        preventer.style.webkitTransform=t[1];
        preventer.style.webkitTransformOrigin=t[0];
        preventer.style.width=s[0]+"px";
        preventer.style.height=s[1]+"px";
        preventer.style.top=p[0]+"px";
        preventer.style.left=p[1]+"px";
    }
    window.addEventListener("orientationchange",modify,false);
    window.addEventListener("load",set,false);
}

然后，如果你写keep(90);（代码中的任何地方），当你转动iPod时，屏幕将保持在横向（左）。

P.S：它仅适用于全屏视图（当应用程序保存到主屏幕时）。

Answer 2

使用UIViewController - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation的这种方法并测试interfaceOrientation是否等于你想要的UIInterfaceOrientation，在这种情况下返回YES，否则为NO。

typedef enum {
   UIInterfaceOrientationPortrait           = UIDeviceOrientationPortrait,
   UIInterfaceOrientationPortraitUpsideDown = UIDeviceOrientationPortraitUpsideDown,
   UIInterfaceOrientationLandscapeLeft      = UIDeviceOrientationLandscapeRight,
   UIInterfaceOrientationLandscapeRight     = UIDeviceOrientationLandscapeLeft
} UIInterfaceOrientation;

用于iPhone iPad iPod的webapp的锁定方向

2 个答案: