JQuery와 크기 조정() 복수의 동적 폭 div의

Question

의 중심을 여기 상황이다. 크기를 조정할 때 버튼의 위치를 ​​정하고 싶습니다. 현재 위치는 절대적입니다. 남은 공간을

나누기 남은 음식을 결정하기 위해 창을 외부에서 내부 사업부

빼기 내부의 외부 사업부

캡처 폭의

1. 캡처 폭 크기 조정시 : 여기
   내 아이디어 동등한 2 개의 마진으로
2. .css()를 사용하여 적용하여 내부 부품의 양쪽에있는 여백을 고정하십시오.

그리고 그 아이디어를 바탕으로 스크립팅 한 내용은 다음과 같습니다.

jQuery(window).resize(function() { 

    var parentWidth = 
    $(".search__btn--wrapper").parent().width(); 

    var childWidth = 
    $(".search__btn--wrapper").width(); 

    var marginWidth = 
     parentWidth - childWidth; 

    var halfWidth = 
     marginWidth/2; 

    $(".search__btn--wrapper").css("left" , halfWidth); 
    $(".search__btn--wrapper").css("right" , halfWidth); 

    console.log('width is now' + $(window).width()); 
    console.log('parent of button element width:' + parentWidth); 
    console.log('button element width:' + childWidth); 
    console.log('leftover margins' + marginWidth); 
    console.log('needed margins' + halfWidth); 

}); 

문제점 (들) 지금까지 내가 모든 크기 조정, 외부와 에 내부 모두의 폭을 얻을 수있어하더라도, 어떤 이유로 marginWidth 변수는하지 않습니다 최신 정보. 반각

에 대한 동일 은 또한 대신 첫 각각에 대해 동적으로이 작업을하기 위해 노력하고있어,하지만 차의 단지 .each() 루프의 일종을 필요 같은 느낌.

처음 부분에는 무엇이 없습니까? 내가 쉽게 바라 보는 것이 뭔가 쉬운 것처럼 느낍니다. <

Answer 1

jQuery에서 코드를 작성해야하고 CSS에서는 작성하지 않아도됩니다. 다음 div 관계에 절대 div를 센터링 할 수 있습니다.

position:absolute; 
left:0; 
right:0; 
margin:0 auto;