웹 페이지의 요소 위치

(x,y) 요소의 좌표를 자바 스크립트에서 가져 오려고합니다. offset이 jquery입니다. 내 코드 :웹 페이지의 요소 위치

var offsets = $('#11a').offset(); 
    var top = offsets.top; 
    var left = offsets.left; 
    console.log("Coordinates of re-ranker (top,left): " +top + "," +left)

내 요소이다 CONSOLE.LOG에

<p id= '11a'>

값 60px x 23px 같은이다 11a의 화소 값과 다르다. 내가 console.log에 들어가는 가치는 완전히 다른 것이며 또한 십진수입니다. 그렇다면 어떤 가치가 내가 offsets에 들어가는가? 픽셀 값과 다른가요?

출처

2014-01-14 user227666

.offset은 문서와 관련된 픽셀 값을 반환합니다.

<div style="position: absolute; left: 33%;"></div>

(나를 위해) 나를 위해 다음 명령 :

이 HTML을 고려 : 모든 크기는 픽셀의 정수이기 때문에이 방법은 예를 들어, 부동 소수점 값을 반환하는 것은 전적으로 가능하다

console.log($("div").offset().left); // Outputs 276.203125

jsFiddle of the above.

그러나, 링크 된 페이지의 노란색 상자를주의하는 것이 중요하다

jQuery를 숨겨진 요소 의 오프셋 좌표를 얻거나 테두리, 여백, 또는 패딩 설정에 대한 회계 지원하지 않습니다 본문.

는 가시성 요소의 좌표를 얻을 수 있지만 : 없음이 렌더링 트리에서 제외되지 않으며, 따라서 그것은 당신에게 오프셋 (offset)를 가져옵니다

출처

2014-01-14 09:39:48 CodingIntrigue

를 통해 CSS 값을받을 수 있나요? – user227666

당신은 그 값을 어디서 얻고 있습니까? – CodingIntrigue

자바 스크립트 콘솔에서 'Elements'를 확인한 다음 id '11a'에 해당하는 웹 페이지에 마우스를 올려 놓으면 일부 픽셀 값이 표시됩니다. – user227666

을 정의되지 위치를 가지고 : 숨겨진 세트, 디스플레이 문서에 상대적인 요소의!

여기에서 자세히 알아볼 수 있습니다 : http://api.jquery.com/offset/

출처

2014-01-14 09:40:16

왜`p`의 픽셀 값과 다른

당신은 그런

$("#11a").css("top").replace("px", ""); // You have to remove the 'px' it returns

출처

2014-01-14 09:53:12 naoxink

'auto'와 같은 것을 얻고 있습니다. – user227666

CSS 상속 (상속)이 없으므로 문서 관련 위치를 가져와야합니다 오프셋. 요소는 고정 된 요소가 아닌 한 화면에서 동일한 위치를 차지하지 않습니다. – naoxink

어떻게받을 수 있습니까? – user227666

웹 페이지의 요소 위치

답변

관련 문제