使用JavaScript判斷手機瀏覽器是橫屏還是豎屏問題
//判斷手機橫豎屏狀態(tài): function hengshuping(){ if(window.orientation==180||window.orientation==0){ alert("豎屏狀態(tài)!") } if(window.orientation==90||window.orientation==-90){ alert("橫屏狀態(tài)!") } } window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", hengshuping, false);
//移動端的瀏覽器一般都支持window.orientation這個參數(shù),通過這個參數(shù)可以判斷出手機是處在橫屏還是豎屏狀態(tài)。
從而根據(jù)實際需求而執(zhí)行相應的程序。通過添加監(jiān)聽事件onorientationchange,進行執(zhí)行就可以了。
在ipad、iphone網(wǎng)頁開發(fā)中,我們很可能需要判斷是橫屏或者豎屏。
下面介紹如何用 jQuery 判斷iPad、iPhone、Android是橫屏還是豎屏的方法
function orient() { if (window.orientation == 90 || window.orientation == -90) { //ipad、iphone豎屏;Andriod橫屏 $("body").attr("class", "landscape"); orientation = 'landscape'; return false; } else if (window.orientation == 0 || window.orientation == 180) { //ipad、iphone橫屏;Andriod豎屏 $("body").attr("class", "portrait"); orientation = 'portrait'; return false; } } //頁面加載時調(diào)用 $(function(){ orient(); }); //用戶變化屏幕方向時調(diào)用 $(window).bind( 'orientationchange', function(e){ orient(); });
屏幕方向?qū)膚indow.orientation值:
ipad: 90 或 -90 橫屏
ipad: 0 或180 豎屏
Andriod:0 或180 橫屏
Andriod: 90 或 -90 豎屏
以上所述是小編給大家介紹的使用JavaScript判斷手機瀏覽器是橫屏還是豎屏問題,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關文章
ES6知識點整理之函數(shù)數(shù)組參數(shù)的默認值及其解構(gòu)應用示例
這篇文章主要介紹了ES6知識點整理之函數(shù)數(shù)組參數(shù)的默認值及其解構(gòu)應用,結(jié)合實例形式分析了ES6函數(shù)數(shù)組參數(shù)解構(gòu)賦值和默認值的設置相關操作技巧,需要的朋友可以參考下2019-04-04JavaScript & jQuery完美判斷圖片是否加載完畢
本文主要介紹了JavaScript & jQuery完美判斷圖片是否加載完畢的方法。具有一定的參考價值,下面跟著小編一起來看下吧2017-01-01JS高級拖動技術 setCapture,releaseCapture
setCapture 的意思就是設置一個對象的方法被觸發(fā)的范圍,或者作用域。2011-07-07微信小程序使用picker實現(xiàn)時間和日期選擇框功能【附源碼下載】
這篇文章主要介紹了微信小程序使用picker實現(xiàn)時間和日期選擇框功能,結(jié)合實例形式分析了微信小程序picker組件進行日期與時間選擇的相關操作技巧,并附帶源碼供讀者下載參考,需要的朋友可以參考下2017-12-12JS中的算法與數(shù)據(jù)結(jié)構(gòu)之列表(List)實例詳解
這篇文章主要介紹了JS中的算法與數(shù)據(jù)結(jié)構(gòu)之列表(List),結(jié)合實例形式分析了javascript列表的概念、原理以及定義、添加、刪除、查找等相關操作技巧,需要的朋友可以參考下2019-08-08js的form表單提交url傳參數(shù)(包含+等特殊字符)的兩種解決方法
下面小編就為大家?guī)硪黄猨s的form表單提交url傳參數(shù)(包含+等特殊字符)的兩種解決方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-05-05