메뉴 닫기

jQuery if 두 번 이상 무한대, 화면 크기별로 높이 비교해서 css 변경 예제

0 답변 글타래를 보이고 있습니다
  • 글쓴이
    • #4248
      Avatar개꿀몬(GKKmon)
      Participant
      • 토픽 30
      • 답변 2
      @gkkmon

      이런 식으로 if 안에 그대로 if문 넣어서 무한정 늘릴 수 있음.
      코드는 ‘#page-breadcrumb’, ‘#page-titlebar’ 등의 height css를 읽어들인 다음에, 그걸 이용해서 높이 비교하고, 크고 작음에 따라 if문으로 다른 요소의 css를 제어하는 것임. 천천히 보면 다 알아볼 수 있게 코딩해 놨음.

      <script>
      if($(window).width() < 1024) {
      		
      	$(document).ready(function () {
      	var height0 = $('#height0').height()
      	var height1 = $('#page-breadcrumb').height()
      	var height2 = $('#page-titlebar').height()
      	var height3 = $('.titlebar-tagline').height()
      
      		if (height2 <height0) {
              
      			if (height1 <height0) {
              	$("#sidebar-primary").css("top", "-42px");
          		} else {
      			$("#sidebar-primary").css("top", "-70px");
          		}
      		
          	} else {
      		
      			if (height1 <height0) {
              	$("#sidebar-primary").css("top", "-86px");
          		} else {
      			
      				if (height3 <height0) {
              		$("#sidebar-primary").css("top", "-114px");
          			} else {
      				$("#sidebar-primary").css("top", "-141px");
          			}
      			
          		}
      		
          	}
      		
      	});
      				
      }
      </script>

      실전 압축 꿀팁! 개꿀몬(GKKmon)

0 답변 글타래를 보이고 있습니다

태그: , ,

  • 답변은 로그인 후 가능합니다.

이메일 구독 - Email Subs

최선을 다해 직접 만든 콘텐츠만 공유합니다.
We share the best content we have created.

이메일 구독 - Email Subs

최선을 다해 직접 만든 콘텐츠만 공유합니다.
We share the best content we have created.