メディアクエリを使用してJavaScriptで定義されたプロパティをオーバーライドする

Question

window.heightプロパティとwindow.widthプロパティを計算してDIVの値を割り当てることによって、DIVの高さと幅を設定します。今度は、DIVはブラウザのビューポート全体に適合します。

ユーザーがウィンドウのサイズを変更したときに、メディアクエリを使用してこれらのディメンションをオーバーライドしたいと考えています。小さな画面では、DIVの高さと幅をウィンドウの高さと幅よりも小さくする必要がありますか？

これは可能ですか？ JavaScriptを使用して設定された高さと幅は、メディアクエリによってオーバーライドされる可能性がありますか？

Answer 1

メディアクエリーを非常にシンプルに保つ限り、単純なjavascript if/elseステートメントを実行できます。

if (screen.width < 480) { 
    // Set some variables 
} else { 
    // Set other variables 
} 

もう1つのオプションは、新しいwindow.matchMedia APIです。