JavaScriptを使って画面の幅を確認する方法

Question

私はドキュメント上で実行可能な関数を用意しています。それは、特定のリンクがナビゲーションバーに表示されているかどうかによって異なります。他のすべてのリンクのCSSを設定して、スペースを揃えます。

私が書いた方法では、最初のDOMロードでのみ実行され、サイズを変更すると小さなブレークポイントでアライメントがずれて見えます。

私の質問は、ウィンドウのサイズに応じてこの機能をどのように実行するのですか。ユーザーがサイズを変更しても、関数が実行され、正しいCSSが設定されます。

これは可能ですか？

私に教えてください！ありがとう！

$(document).ready(function() { 
    var link = $('#catNav-sale').css('display'); 
    var winWidth = $(window).width(); 

    if (SaleLinkCSS == 'block') 
    { 
     if (winWidth >= 975) 
     { 
      $('#ID').css('left', '185px'); 

     } 
     else 
     { 

     } 

    } 

Answer 1

あなたは、次のいずれかを試すことができ、

バニラ

window.onresize = function(event) { 
    /** Your code here. **/  
}; 

jQueryの

$(window).resize(function() { 
    /** Your code here. **/ 
}); 

やCSSオプションがmedia queriesを使用することです。

読み物

(on)resize

jQuery's resize