iPhone Mobile Safari 3에서 getBoundingClientRect에 해당하는 항목은 무엇입니까?

Question

iPhone Mobile Safari의 element.getBoundingClientRect가 누락 된 것 같습니다. iPhone Mobile Safari에서 이와 동일한 방법은 무엇입니까? 이 방법은 iPad에 있습니다.

Answer 1

편집 1 :이 코드 (webkitConvertPointFromNodeToPage)는 오래된 전화기와 오래된 전화기에만 필요합니다 ... these comments을 참조하십시오.

EDIT 2 :이 코드를 사용하지 않는 것이 좋습니다 ... 터치 줌을 사용하여 IE10의 일부 문제를 해결하기 위해이 코드를 변경했습니다. 수정 코드를 업데이트하는 것을 기억하려고 노력할 것입니다.

이 되었습니까 :

function offset(el) { 
    var convertPoint = window.webkitConvertPointFromNodeToPage; 
    if ('getBoundingClientRect' in el) { 
     var 
      boundingRect = el.getBoundingClientRect(), 
      body = document.body || document.getElementsByTagName("body")[0], 
      clientTop = document.documentElement.clientTop || body.clientTop || 0, 
      clientLeft = document.documentElement.clientLeft || body.clientLeft || 0, 
      scrollTop = (window.pageYOffset || document.documentElement.scrollTop || body.scrollTop), 
      scrollLeft = (window.pageXOffset || document.documentElement.scrollLeft || body.scrollLeft); 
     return { 
      top: boundingRect.top + scrollTop - clientTop, 
      left: boundingRect.left + scrollLeft - clientLeft 
     } 
    } else if (convertPoint) { 
     var 
      zeroPoint = new WebKitPoint(0, 0), 
      point = convertPoint(el, zeroPoint), 
      scale = convertPoint(document.getElementById('scalingEl'), zeroPoint); 
     return { 
      top: Math.round(point.y * -200/scale.y), 
      left: Math.round(point.x * -200/scale.x) 
     } 
    } 
} 

다음과 같은 몸의 자식 : 나는 IE6 +, FF3 +, 사파리 2+ (데스크탑 & 모바일), 크롬 (데스크탑 & 안드로이드), 오페라의 다음 작품을 생각한다 :

<div id="scalingEl" style="position:absolute;top:-200px;left:-200px;visibility:hidden;"></div> 

메서드는 일부 오류 검사가 필요합니다 (예 : 요소는 문서에 있어야합니다). Scale은 페이지가 확대되었을 때 작동하지만 필요하지 않을 수도 있습니다 (Windows Safari에서 webkitConvertPointFromNodeToPage를 테스트 할 때 필요했습니다). 아이폰 OS 3에 ele.getBoundingClientRect(). 폭 방법을 찾고있는 사람들을위한

Answer 2

, 당신은 간단한 검사 '가 될 수 ele.offsetWidth

if("getBoundingClientRect" in this.container) { 
    this.width = this.container.getBoundingClientRect().width ;  
}else { 
    this.width = this.container.offsetWidth; //http://help.dottoro.com/ljvmcrrn.php 
}