JQuery 각 Div 요소의 높이 가져 오기

특정 CSS 클래스가있는 각 div 요소의 높이를 가져 오는 다음 함수가 있습니다. 각 컨테이너에는 div 요소로 구성된 측면 버튼이 있습니다. 컨테이너 div의 높이에 따라 다르며 각 컨테이너의 높이가 다를 수 있기 때문에 CSS div로 높이를 설정할 수 없습니다. 그래서 저는 jquery로해야만합니다. 나는 높이가 같도록 컨테이너의 높이를 기준으로 버튼의 높이를 설정하려고합니다. 컨테이너 높이를 가져 와서 버튼 높이를 그 높이와 같게 설정하십시오.JQuery 각 Div 요소의 높이 가져 오기

도와 주시겠습니까? 고맙습니다!

// sidebar button 
function SideBarBtn(){ 
    $('.ContactWrap').each(function(){ 
     var FormHeight = $(this).outerHeight(); 
     var SideBtnHeight = FormHeight -25 + 'px'; 
     $('.SideBtn').css('height', SideBtnHeight); 
     $('.SideBtn').fadeIn('slow').fadeOut('slow').fadeIn('slow'); 
    }); 
}

HTML :

<div class="ContactWrap"> 
    <a href="#submit" class="SideBtn"> S u b m i t - B a r</a> 
    ..... 
</div>

출처

2012-01-11 user1002039

* HTML이 필요합니다. * –

html은 길이가 1 마일입니다 ... – user1002039

@ usser1002039 분명히 관련 HTML 코드입니다. '.ContactWrap'과'.SideBtn'을 포함하는 문서 구조는이 대답에 매우 중요합니다. –

문제는이 라인에 의해 발생 :

$('.SideBtn').css('height', SideBtnHeight); 
$('.SideBtn').fadeIn('slow').fadeOut('slow').fadeIn('slow');

이 선택기 클래스 SideBtn와 모든 요소를 선택하고 새 스타일을 적용합니다. 문제를 해결하려면보다 구체적인 선택기를 사용해야합니다.

올바른 코드는 다음과 같습니다 당신은 클래스 .ContactWrap을 가진 요소를 통해 반복하지만, 클래스 .SideBtn와 모든 요소에 높이 변화와 fadeIn, 페이드 아웃, fadeIn을 적용하고

var $btn = $(this).find('.SideBtn'); 
$btn.css('height', SideBtnHeight); 
$btn.fadeIn('slow').fadeOut('slow').fadeIn('slow');

출처

2012-01-11 22:52:10

나는 내가 이해할 지 모르겠다. 컨테이너 높이를 기반으로 버튼 높이를 설정해야합니다. 이것은 컨테이너 높이를 설정하는 것 같습니다. – user1002039

이 코드는 질문의 코드를 기반으로합니다. 관련 ** HTML ** 코드를 표시 할 수 있습니까? –

자, 질문을 변경했습니다. – user1002039

. 그래서 루프가 반복 될 때마다 .each() 루프는 .css()이고, fade 함수는 모두 .SideBtn 요소입니다. 그래서 높이가 항상 SideBtnHeight의 마지막 값이됩니다. 당신은 실제로 모든 다른 값을 얻고 있지만, 마지막 값만이 붙습니다.

출처

2012-01-11 22:53:04 maxedison

JQuery 각 Div 요소의 높이 가져 오기

답변

관련 문제