[JQuery]調整視窗大小時，版面跟著調整

如果想要讓您的網頁，根據瀏覽器視窗大小，而決定要顯示多少內容

可以透過JQuery來處理，不多說我們直接進入範例

首先在您Js檔及CSS放入<head></head> 中

並且將以四個DIV加入Body

JQuery的程式碼您可以考慮寫在<Body></Body>中，不過在開發大型網頁時，小編建議也包成一個JS檔方便管理

$(function(){
    $(window).resize(function(){ 
        $('.box').each(function(){
              if ( $(window).width() < ($(this).index()+1)*200)
              {
                 $(this).css('display','none');
              }
              else
              {
                 $(this).css('display','');
              }
         });
  
     });
});

(此範例紅、黃、綠的底色為黑色，視窗縮小後上層色即消失)