브라우저 크기 조정 이벤트를 감지 할 수 있습니까?

Question

나는 간단한 4- 창 개체 편집기를 만들고 있으며 캔버스 크기 조정은 약간 문제가 있습니다. CSS 안의 캔버스 크기를 조정해서는 안되며 명시 적 픽셀 너비와 높이를 정의해야한다는 것을 알게되었습니다. 나는 브라우저를 크기 조정할 때 모든 것이 즉시 크기가 조정되도록 모든 것을 설정하려고 시도했습니다. 그래서 기본적으로 행 1,3 및 5의 5x5 테이블에 5px 및 열 1,3,5의 높이로 너비는 5px입니다. 남아있는 4 개의 셀은 모두 동일한 크기입니다.

발견 된 각 표 셀에 div를 배치하고 div에 배경과 테두리를 CSS와 0px 채우기와 함께 표시합니다. 폭이나 높이를 지정하지 않았습니다 (하지만 100 %로 시도했습니다).

나는 각 사업부 내부 캔버스를 배치하고 모든 것이 배치 될 때까지 크기를 지정하지 마십시오. 그 후, 표 셀 중 하나의 너비와 높이를 읽고 그에 따라 각 캔버스의 크기를 설정합니다. 각 캔버스 아래쪽과 테두리 사이에 이상한 3px 간격이있어서 괜찮습니다. div를 포함하고 있습니다. 테이블의 경우, 패딩을 지정했습니다 : 0px; border-spacing : 0px; 그리고 국경 붕괴 : 붕괴; td 셀의 경우 지정된 패딩을 지정합니다. 0px;

갭은 문제 # 1입니다.

두 번째 문제는 각 캔버스의 너비와 높이가 정의되어 있기 때문에 화면의 다른 모든 구성 요소가 창 크기가 변경되면 자동으로 크기가 조정되지만 캔버스 요소는 고정 된 상태로 유지된다는 것입니다. 어떻게 든 창 크기 조정 이벤트를 감지하고 캔버스 요소를 재생성 할 수 있습니까? 이상적으로, 크기가 표시되는 동안 크기가 느리기 때문에 크기 조정이 시작될 때 요소를 숨기거나 제거하고 크기 조정이 완료되면 다시 작성하고 표시하고 싶습니다. ???

Answer 1

$(window).resize(function() { 
    // handle accordingly 
}); 

Answer 2

는 resize^jQuery보십시오 :

$(window).resize(function(){ 
    // regenerate canvas 
});