2011-11-22 5 views
5

이 div에는 고정 높이 (스크롤 가능) 및 2 개의 작은 div가있는 마스터 div가있는 간단한 html 페이지가 있습니다. 스크롤하는 동안 마스터 div의 중간 지점에 현재 요소를 가져 오려고합니다. 그것은 IE8을 제외한 모든 브라우저에서 잘 작동합니다. IE8에서 document.elementFromPoint()는 가능한 모든 값에 대해 onscroll 이벤트에서 null을 좌표로 반환합니다. 누구나이 문제에 대한 해결책이나 해결책을 알고 있습니까?onscroll 이벤트에서 사용할 때 elementFromPoint가 null을 반환합니다.

<div id="mainDiv" style="height:300px;min-height:300px;overflow:auto;" onscroll="mouseScrolled();"> 
     <div id="div1" style="height:500px;min-height:500px;background-color:blue;display:block;"> 

    </div> 
     <div id="div2" style="height:500px;min-height:500px;background-color:red;display:block;"> 

     </div> 
    </div> 

    <span id="debugSpan"> 
    </span> 

자바 스크립트 : 솔루션 아마도 아니라 가장 우아한 동안, 나는 elementFromPoint에서 그렇지 않은 경우 무엇인가를받은 경우 체크 결국

function mouseScrolled(event) { 

     var mainDiv = document.getElementById('mainDiv'); 
     var x = getXY(mainDiv)[0] + mainDiv.offsetWidth/2; 
     var y = getXY(mainDiv)[1] + mainDiv.offsetHeight/2; 
     var ctr = document.elementFromPoint(x , y); 

     document.getElementById('debugSpan').innerHTML = "ClientX=" + x + "<BR>" + "ClientY=" + y +"<BR> Control:" + ctrId; 

    } 

    function getXY(obj) { 
     var curleft = curtop = 0; 
     if (obj.offsetParent) { 
      do { 
       curleft += obj.offsetLeft 
       curtop += obj.offsetTop 
      } 
      while (obj = obj.offsetParent) 
     } 
     return { x: curleft, y: curtop }; 
    } 

답변

3

이하는을 사용하여 다음

는 HTML 코드 setTimeout (fn, 0)을 사용하여 다음 무료 클록 사이클에서 함수 호출을 다시 시도하십시오. IE9 및 다른 브라우저에서는 처음으로 작동하는 것으로 보입니다. IE8의 경우 스크롤 이벤트 처리가 끝나면 요소를 제공하는 시간 초과 및 발생을 설정합니다.

+0

그것은 마치 마법과 같습니다. 이미 다른 방법으로 계산하기로했지만이 방법을 사용하면 훨씬 더 유용 할 것입니다. 고맙습니다. –

관련 문제