자바스크립트 계산된 height 값을 백분율로 변경

본문 바로가기

자바스크립트 계산된 height 값을 백분율로 변경

작성일 2018.10.12댓글 1건
    게시물 수정 , 삭제는 로그인 필요

정렬된 이미지나 li 의 높이 똑같이 맞추기를 반응형으로..


$(window).load(function() {
var max_h=0;
$("#hello li").each(function(){
var h = parseInt($(this).css("height"));
if(max_h<h){ max_h = h; }
});
       $("#hello li").each(function(){
$(this).css({height:max_h});
});
});
위와 같이 나란히 정렬된 li의 높이갚을 똑같이 맞추는 코드입니다.
그러나 처음 계산된 height 값이 정해져 있어 브라우저 창의 크기가 변할때마다 보기 흉합니다.
계산된 값을 백분율(%)로 계산해 css 에 적용하는 방법을 알고 싶습니다.
어찌해야 하나요.
고수분들의 조언 부탁드립니다. please ~


#자바스크립트 계산된 프로퍼티

profile_image 익명 작성일 -

리사이징 이벤트가 일어날때도 함수를 다시 호출할수 있도록 해야할거 같습니다.


<script type="text/javascript">
$(function(){
var matchH = function(){
var max_h=0;
var target = $("#hello li");
target.removeAttr('style','');
target.each(function(){
var h = parseInt($(this).css("height"));
if(max_h<h){ max_h = h; }
$(this).css({height:max_h});
});
};

$(window).load(function() {
matchH();
});

var delta = 300;
var timer = null;
$( window ).bind('resize', function( ) {
clearTimeout( timer );
timer = setTimeout( matchH, delta );
} );

});
</script>

연관된 질문 답변 리스트

공룡게임 자바스크립트

... 로 변경하게 된다면 공룡이 점프 한... 물론 수치적인 계산이지만 아직 초보... canvas.width = window.innerWidth - 100;2 canvas.height...

자바스크립트 항목 수 세는 방법 좀...

... 자바 스크립트를 처음 접해봐서 통 함수 사용하는 방법을 모르겠네요.ㅠㅠㅠㅠㅠ... 문서의 변경과 현재 개정상태의 식별, 문서배포, 폐기된 문서의 사용금지 등의 통제를...

자바스크립트... 도움이 필요합니다. ㅜ

... 2 가 나왔을때 총합 계산을 앞에 1은 그대로 두고... 값이 변경될 때 이 이벤트가 발생합니다.... (1) 자바스크립트에서 부동 소수점 처리에 대한 오류 수정을...

자바스크립트 한번 봐주세요

... 자바스크립트 금액 계산인데, 계산하기 버튼을 클릭하면... [이미지로 변경] 이것저것 신경 쓰시는 것이 싫으시면, 그냥...

자바스크립트 달력 만들기 질문

자바스크립트로 연습 삼아 달력을 만들어 보고 있습니다.... else nday = 28; } // 요일을 계산하는 부분 for (var i = 0; i < document.all.days....

자바스크립트 질문!! 도와주세요.ㅠ

... 문서의 변경과 현재 개정상태의 식별, 문서배포, 폐기된 문서의 사용금지 등의... 문서의 변경과 현재 개정상태의 식별, 문서배포, 폐기된 문서의 사용금지 등의 통제를...