jQuery Mobile 锁定方向

Posted 2023-05-09

【中文标题】jQuery Mobile 锁定方向

【英文标题】：jQuery Mobile lock orientation

【发布时间】：2011-10-23 23:54:57

【问题描述】：

我正在使用 phonegap 和 jquery mobile 为 android 手机构建应用程序。是否可以将方向锁定在一页上？例如。页面“地图”已加载，方向锁定为“横向”模式。

【参考方案1】：

我尝试修改 manifest.xml 并且它有效。只需将 android:screenOrientation="landscape" 属性添加到您的活动标签，如下所示：

<application android:icon="@drawable/ic_launcher" android:label="@string/app_name">
    <activity android:label="@string/app_name" android:name=".Phonegap_AppName"
        android:configChanges="orientation|keyboardHidden" android:screenOrientation="landscape">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

【参考方案2】：

我认为不是。在 xCode for ios 应用程序中是不可能的。我能想出的唯一解决方法是根据window.orientation 旋转你的身体或包装器

$(window).bind("orientationchange", function()
    var orientation = window.orientation;
    var new_orientation = (orientation) ? 0 : 180 + orientation;
    $('body').css(
        "-webkit-transform": "rotate(" + new_orientation + "deg)"
    );
);

这是一种冒险的方式，但认为这是唯一的方式..

希望对你有帮助，请告诉我！

见：http://jsfiddle.net/aalouv/sABRQ/1/

---

您可以绑定到窗口调整大小事件。

$(window).bind("resize", function()
    var orientation = window.orientation;
    var new_orientation = (orientation) ? 0 : 180 + orientation;
    $('body').css(
        "-webkit-transform": "rotate(" + new_orientation + "deg)"
    );
);

---

我不久前写了这个小脚本：它修复了 iOS safari 中的乘法调整大小回调错误和 android 中的 non-/late-/early-trigger(1)orientationchange 错误。

(1) 有时在浏览器改变宽度+高度之前和之后有时不触发？有线！

if (!(/iphone|ipad/gi).test(navigator.appVersion)) 
    $(window).unbind("resize").bind("resize", function() 
        $(window).trigger("orientationchange");
    );

如果不是 iphone 或 ipad，您将触发窗口上的orientationchange 事件。

因此，当您绑定任何函数时，您所做的调整大小会引发方向更改。

【讨论】：

嗨 Andreas Al，感谢您的回复，我尝试使用您的解决方案，但事实上，即使我旋转屏幕，我也不会进入绑定功能。我也用 jQuery 的.live 函数做到了，但还是不行。

啊，好吧，也许必须绑定到文档而不是窗口。见上面的编辑

它的安卓版！我自己在android上的orientationchange有一些问题。我仍然认为您可以使用调整大小和存档相同的结果。但要注意 iOS 调整大小会在每次方向更改时触发多达 10 次。

好吧，完美的“调整大小”类型它可以工作，但现在我的标题正在跳跃。我如何才能仅在“横向”模式下修复它？

也许将你所有的东西包装在一个 div 标签中，而不是旋转主体旋转 div。考虑绝对位置等等......