2012-10-09 1 views
0

는 그럼 다음과 같은 내용 구조를 가지고 가정 해 봅시다 폭)를 선택하고 다른 3 개 div의 너비를 50 픽셀 씩 늘립니다. 결국 나는 다음을 원합니다 :

<div class="wrapper"> 
    <div class="contentOne" style="width:50px"></div> 
    <div class="contentTwo" style="width:100px"></div> 
    <div class="contentThree" style="width:150px"></div> 
    <div class="contentFour" style="width:200px"></div> 
</div> 

CSS3 Calc를 사용하는 것이 가장 좋습니다. 그렇지 않으면 JS는 가까운 공주가 될 것입니다.

고마워요.

답변

3

지금, CSS는 너무 순수 CSS의 솔루션은 아직 가능하지 않다, 더 위의-형제 선택이 없습니다. jQuery는 다음과 같을 것입니다 :

$('div:not(:first)').each(function() 
{ 
    $(this).width($(this).prev().width() + 50); 
}); 
+0

간단하고 효과적입니다. 감사! – Kurt

1

여기에 Jquery를 사용하십시오. 코드는 다음과 같습니다. 이 변경 사항을 적절한 데모 코드로 변경하십시오. (몇 가지 이유를 들어, "다음 형제"선택이 있지만)

var widthOfFirstChild=$('.wrapper').eq(1).width(); 
    $('.width div').each(
    function(){ 
    $(this).attr('style':widthOfFirstChild+50); 
    widthOfFirstChild=+50 
    });