您可以強制 Web 應用程式橫向定位嗎？

強制應用程式橫向

問題： 強制應用程式以「橫向」模式顯示，儘管其設計為「縱向」模式，是一個經常出現的問題。如何實現這一點？

原始答案：

不幸的是，不可能將網站或 Web 應用程式限制為特定方向。存在此限制是為了保留設備固有的使用者體驗。但是，您可以使用以下方法來偵測目前方向：

• CSS3 媒體查詢：

@media screen and (orientation:portrait) {
    /* CSS applied when the device is in portrait mode */
}

@media screen and (orientation:landscape) {
    /* CSS applied when the device is in landscape mode */
}

• JavaScript方向改變事件：

document.addEventListener("orientationchange", function(event){
    switch(window.orientation) 
    {  
        case -90: case 90:
            /* Device is in landscape mode */
            break; 
        default:
            /* Device is in portrait mode */
    }
});

更新答案（2014 年11 月12 日）：

隨著HTML5 Web 應用程式清單的出現，強制定向模式現在是可能的。這可以透過以下方式實現：

• 建立一個manifest.json 檔案並包含以下行：

{
    "display":      "standalone", /* Could be "fullscreen", "standalone", "minimal-ui", or "browser" */
    "orientation":  "landscape", /* Could be "landscape" or "portrait" */
    ...
}

• 在HTML 檔案中引用清單：

<link rel="manifest" href="manifest.json">

請注意，鎖定方向的Web應用程式清單的支援可能會有所不同瀏覽器。

以上是您可以強制 Web 應用程式橫向定位嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！