자바스크립트에서 미디어쿼리 처럼 CSS 사용하기

간단히 가능한거만 확인

<link rel="stylesheet" type="text/css" href="css/main1.css" id=style1 />

<link rel="stylesheet" type="text/css" href="css/main2.css" id=style2 />

<link rel="stylesheet" type="text/css" href="css/main3.css" id=style3 />

<script type="text/javascript" src="js/jquery-1.8.1.min.js"></script>

// 스타일시트를 disalbed함

$("#style1").attr("disabled", "disabled"); 

$("#style2").attr("disabled", "disabled"); 

$("#style3").attr("disabled", "disabled"); 

function funTest(state){ 

$("#style1").attr("disabled", "disabled"); 

$("#style2").attr("disabled", "disabled"); 

        $("#style3").attr("disabled", "disabled"); 

 

$("#style"+ state).removeAttr("disabled");   // 스타일을 적용함 (즉 스타일시트 disabled한 것을 제거함 

}

</script>

<a href=javascript:funTest('1')>1111111111</a>

<a href=javascript:funTest('2')>2222222222</a>

<a href=javascript:funTest('3')>3333333333</a>