2012-06-05 5 views
3

DOM 트리의 깊이에 상관없이 방화범이 끌린 모든 DOM 요소의 절대 좌표 (문서의 시작 부분에 상대적으로)를 가져와야합니다. 그런 플러그인이 있습니까?방화 광 - 절대 좌표 얻기

답변

3

실제로 플러그인이 필요하지는 않지만 일부 Firebug 내부에 대한 JavaScript + 지식 만 있습니다.

this article에서 DOM 요소의 절대 좌표를 얻는 방법을 찾을 수 있습니다. 각 DOM 요소에는 다른 DOM 요소 (offsetParent)에 관한 위치를 정의하는 속성 .offsetLeft .offsetTop .offsetParent이 있습니다. 계층 구조 맨 위에있는 요소는 offsetParent = null입니다. 엘리먼트와 그것의 offsetParents를 가로 지르면서 절대 좌표를 찾을 수있다. 해당 페이지에서 복사

코드 :

var findpos = function findPos(obj) { 
    var curleft = curtop = 0; 
    if (obj.offsetParent) { 
     do { 
     curleft += obj.offsetLeft; 
     curtop += obj.offsetTop; 
     } while (obj = obj.offsetParent); 
     return [curleft,curtop]; 
    } 
} 

(방화범을 붙여 넣은 다음 콘솔에서 사용할 수있는 findpos 기능을 가지고).

대부분의 경우 가장 간단한 경우 오프셋 그림자가 0 인 offsetParent = <body>이 있으므로 offsetLeft 및 offsetTop에 아무 것도 추가하지 않아도됩니다. 그러나 상대적인 위치 지정이 발생하면 부모를 지나쳐야합니다.

Firebug에서 요소를 선택하면 Firebug 콘솔에서 $0으로 사용할 수 있습니다.

는 그래서, 두 가지를 혼합 한 후, 당신은 스크린 샷처럼 명령을 실행할 수 있습니다 :

Firebug - finding absolute coords of a node

쉽게 모든 요소의 절대 좌표를 얻을 수 있습니다.

위 스크립트를 붙여 넣은 스크립트는 대부분 대다수에서 작동합니다. 좀 더 견고한 기능을 위해서도 this post을 읽어 볼 수 있습니다.

관련 문제