jQuery Mobile 方向改變事件

2018-02-03 16:38 更新

jQuery Mobile 方向改變事件

當設備的方向變化（設備橫向持或縱向持）時，將觸發(fā)jQuery Mobile方向改變事件。

jQuery Mobile 方向改變（orientationchange）事件

當用戶垂直或水平旋轉移動設備時，觸發(fā)方向改變（orientationchange）事件。





Mobile


如需使用方向改變（orientationchange）事件，請附加它到 window 對象：

$(window).on("orientationchange",function(){
alert("The orientation has changed!");
});

回調函數(shù)可有一個參數(shù)，event 對象，返回移動設備的方向："縱向"（設備保持在垂直位置）或"橫向"（設備保持在水平位置）：

實例

$(window).on("orientationchange",function(event){
alert("Orientation is: " + event.orientation);
});

嘗試一下 ?

由于方向改變（orientationchange）事件綁定到 window 對象，我們可以使用 window.orientation 屬性來設置不同的樣式，以便區(qū)分縱向和橫向的視圖：

實例

$(window).on("orientationchange",function(){
if(window.orientation == 0) // Portrait
{
$("p").css({"background-color":"yellow","font-size":"300%"});
}
else // Landscape
{
$("p").css({"background-color":"pink","font-size":"200%"});
}
});

嘗試一下 ?

lamp window.orientation 屬性針對縱向視圖返回 0，針對橫向視圖返回 90 或 -90。

注意：當瀏覽器不支持orientationChange事件的時候綁定resize事件。

在下一節(jié)內容中，我們將介紹jQuery Mobile頁面事件！

以上內容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號