해상도에 따른 클래스 변경 스크립트 알 수 있을까요
본문
현재 m-item 이라는 클래스가 div에 적용되어 있으면
해상도 768px 이하일때에는 g-item으로 클래스가 바뀌었으면 좋겠습니다.
답변 2
<script>
$(document).ready(function() {
if($(window).width() < 768) {
$(".m-item").attr('class','g-item')
}
});
</script>
알려주신대로 했는데 적용이 안됩니다ㅠㅠ
맨처음 로딩된 창 크기가 768일 때입니다.
만약 창 크기를 조정 할때의 조건문이라면
<script>
$(window).resize(function() {
if($(window).width() < 768) {
$(".m-item").attr('class','g-item')
}
});
$(document).ready(function() {
if($(window).width() < 768) {
$(".m-item").attr('class','g-item')
}
});
</script>
이렇게 하셔야 하시구요.
이럴경우 보통 모바일이나 태블릿을 768 사이 미만으로 만드는데 코드가 작동을 안합니다. 창 크기가 조정 될때 이기 때문에..
그냥 편하게 위에 2개 다쓰셔도 됩니다.
오 됩니다!! 감사합니다ㅠㅠ바로 됐습니다!!
function window_size(){
var windowWidth = $( window ).width();
if(windowWidth < 768) {
//창 가로 크기가 768 미만일 경우
} else {
//창 가로 크기가 500보다 클 경우
}
}
알려주신대로 했는데 적용이 안됩니다ㅠㅠ
