jquery BS,대화 상자 제어 적응형 size_jquery

스타일이 좀 못생겨서 다시 만들었습니다. 그런데 완성해 보니 IE에서 제대로 작동하지 않고 적응형 크기를 구현할 수 없었습니다.

알고보니 xhtml이 필요한데, 회사 제품은 html이네요. 이를 위해 적응형 크기 구현에 대해 연구했습니다.

저는 항상 jquery가 너비와 높이를 얻는 데 매우 마술적이라고 생각했습니다. 요소가 DOM에 삽입되면 offsetWidth/offsetHeight 및 기타 요소 속성을 직접 가져오는 것으로 나타났습니다. dom을 사용하면 브라우저는 규칙에 따라 해당 속성을 계산합니다.

scrollWidth는 가장자리 너비를 제외한 개체의 실제 콘텐츠 너비이며, 개체의 콘텐츠 양에 따라 변경됩니다(콘텐츠가 너무 많으면 개체의 실제 너비가 변경될 수 있음).

clientWidth는 스크롤 막대 및 기타 가장자리를 제외한 개체의 표시 너비이며 창의 표시 크기에 따라 변경됩니다.

offsetWidth는 스크롤 막대 및 기타 가장자리를 포함하여 개체의 표시되는 너비이며 창의 표시 크기에 따라 변경됩니다.

clientWidth, offsetWidth, clientHeight.. 차이점



IE6.0, FF1.06:
clientWidth = 너비 패딩
clientHeight = 높이 패딩
offsetWidth = 너비 패딩 테두리
offsetHeight = 높이 패딩 테두리
IE5.0/5.5:
clientWidth = 너비 - 테두리
clientHeight = 높이 - 테두리
offsetWidth = 너비
offsetHeight = height
(언급해야 합니다: CSS의 margin 속성은 clientWidth, offsetWidth, clientHeight 및 offsetHeight와 아무 관련이 없습니다.)

offsetwidth: 상위 요소를 기준으로 한 요소의 오프셋 너비입니다. . 테두리 패딩 너비와 동일
clientwidth: 요소의 표시 너비입니다. 패딩 너비와 동일
scrollwidth: 요소의 너비이며 스크롤 부분을 포함합니다.

구현할 수 없는 이유를 조사했습니다. jquery.alerts 컨트롤은 div로 가득 차 있는 것으로 나타났습니다. IE의 간단한 HTML에서는 내부 내용에 따라 div의 너비가 이만큼 커지는 것 같습니다. 물론 XHTML의 경우 offsetWidth로 충분합니다.

EXT의 구현을 살펴보면 내부 콘텐츠가 콘텐츠 크기에 따라 변경되는 범위 및 기타 el을 사용하는 방식으로 오프셋 속성을 얻은 다음 각 항목의 너비를 얻는 것이 훨씬 더 똑똑합니다. 내부 el은 패딩과 테두리를 포함하여 외부 레이어의 전체 너비를 계산하는 추가입니다.

저도 간단하게 xhtml을 사용하고 싶지만 다른 방법이 없습니다. EXT를 배우는 것이 더 번거롭지만 신뢰할 수 있습니다.