테스트 사이트 - 개발 중인 베타 버전입니다

해상도에 따른 클래스 변경 스크립트 알 수 있을까요 채택완료

midal 5년 전 조회 2,630

현재 m-item 이라는 클래스가 div에 적용되어 있으면

해상도 768px 이하일때에는 g-item으로 클래스가 바뀌었으면 좋겠습니다.

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
Dessi
5년 전

<script>
    $(document).ready(function() {
        if($(window).width() < 768) {
            $(".m-item").attr('class','g-item')
        }
     });
</script>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 3개

m
midal
5년 전
알려주신대로 했는데 적용이 안됩니다ㅠㅠ
D
Dessi
5년 전
맨처음 로딩된 창 크기가 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개 다쓰셔도 됩니다.
m
midal
5년 전
오 됩니다!! 감사합니다ㅠㅠ바로 됐습니다!!

댓글을 작성하려면 로그인이 필요합니다.

toqurk
5년 전

function window_size(){
var windowWidth = $( window ).width();
if(windowWidth < 768) {
//창 가로 크기가 768 미만일 경우
} else {
//창 가로 크기가 500보다 클 경우
}
}

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

m
midal
5년 전
알려주신대로 했는데 적용이 안됩니다ㅠㅠ

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인