2011-12-14 2 views
0

이제 하나의 사이트를 개선 중입니다 - http://vse-v-nas.com.ua (누군가가 더 자세히 보길 원하면 재현 단계를위한 링크). 내용의'resize'이벤트 처리기가 발생하지 않습니다.

오른쪽 열 :

// html 
<td id="sidebar-right">...</td> 
// css 
#sidebar-right { 
    width: 209px; 
    padding: 10px; 
} 

즉, $ ('# 사이드 바 오른쪽') 폭() 229px 및 가 크롬에 있지만 그것은 '245px'값을 가지고이어야합니다. FF 8.0.1 및 IE 9.0.3

콘텐츠의 오른쪽 너비가 다른 이유는 FF와 IE가 크롬보다 인데, 그 이미지를 오른쪽 상단 모서리 ($ (' img.header-image '))는 Chrome에서와 같이 아래 오른쪽 열과 동일합니다.

이미지와 오른쪽 사이드 바에 동일한 너비를 설정하기 위해 태그 끝 부분 앞에 본문에 스크립트를 추가했습니다.

<script type="text/javascript" language="javascript"> 
    $(document).ready(function() { 
    var $headerImage = $('img.header-image'); 
    var $rightSidebar = $('#sidebar-right'); 

    // in this line $rightSidebar.width() is 229px in every browser... 

    $rightSidebar.resize(function() { 
     // event handler doesn't occur after width changing in IE and FF... 
     alert($headerImage.width()); 
     alert($(this).width()); 
    }); 
    }); 
</script> 

이벤트 처리기가 발생하지 않지만 페이지로드 후 크기가 변경됩니다. 누구나이 문제를 해결하는 데 도움이 될 아이디어가 있습니다!

답변

1

위의 답변과 같은 소리는 사용자의 직접적인 질문에 대한 답변입니다. 사파리와 파이어 폭스에서 245의 이유에 관해서는, 다른 브라우저에 의해 추정되는 기본 CSS, 특히 많은 테이블을 사용하고 있기 때문에 경계선 간격이 줄어들었다. 내용이 더 크면 사이드 바 div가 229px보다 넓어집니다.

+0

안녕하세요, David님께 서 쓴대로 이전 개발자 이후에이 사이트를 개선하고 있습니다. 어쨌든 .NET에서 나중에 다시 작성하려고합니다. 하지만 지금은 올바르게 작동해야합니다. –

관련 문제