不同的javascript/jQuery功能通過屏幕方向移動和瀏覽器

Question

聲明：我不是一個JavaScript或jQuery專家。

這可能是一個容易解決的問題，因爲它只是一個小小的修復，我找不出來。如果瀏覽器處於橫向模式，我正在實施一個橫向網站，如果縱向瀏覽，則是垂直網站。對於媒體查詢而言，CSS更改不是問題。我遇到的問題是當我只想在屏幕處於橫向模式時運行特定的腳本。我遇到的下一個問題是，我不僅希望在移動設備上工作，而且還希望它能夠在標準瀏覽器中響應，即檢測何時屏幕寬度>屏幕高度並運行所述腳本。這是我到目前爲止的代碼：

var height = $(window).height(); 
var width = $(window).width(); 
if (width > height) { 
    //run landscape script 
} else { 
    //run portrait script 
}; 

這是工作就好了頁面加載時檢測到的方向，但是當屏幕大小，因爲劇本沒有被綁定到window.resize它不會改變。這就是說，它綁定到window.resize時也不起作用。

有沒有更好的方法來解決這個問題？或者我只需要修理已經在這裏的東西？

Answer 1

如果將來有人遇到這個問題，我會發布什麼解決了我的問題。

當我試圖resize事件添加到函數，我的代碼是這樣的：

$(window).on('resize', function() { 
    var height = $(window).height(); 
    var width = $(window).width(); 
    if (width > height) { 
     //run landscape script 
    } else { 
     //run portrait script 
    }; 
)}; 

這工作得很好，但因爲劇本僅被髮射時就沒有出現這樣瀏覽器調整大小。雖然這是必不可少的，但腳本也需要在頁面加載時觸發。我的解決方案只是爲事件添加「加載」：

$(window).on('resize load', function() { 
    var height = $(window).height(); 
    var width = $(window).width(); 
    if (width > height) { 
     //run landscape script 
    } else { 
     //run portrait script 
    }; 
)};