[javascript] js 에서 css 미디어 쿼리

var media1 = window.matchMedia( '( max-width: 330px )');  //ipone4,5,SE 320px
var media2 = window.matchMedia( '( max-width: 285px )');  //갤럭시 폴드 280px ~ 319px
var popBody = 변경해야 하는 대상;

if(media1.matches == true)
    if(media2.matches == true)
        popBody.css({ 'min-height' : '200.6px'});   //갤럭시 폴드
    
    popBody.css({ 'min-height' : '181.88px'});		//ipone4,5,SE
else
    popBody.css({ 'min-height' : '145.5px'});		//기본크기

위와 같이 비교 대상을 정한 후

java Pattern.matches  같이 사용 

 

min-width	최소 길이
min-width : 330px;            window.innerWidth >= min-width   == true
max-width	최대 길이
max-width : 330px;            window.innerWidth =< max-width   == true