특정 엘리멘트의 좌표 가져오기..

[hiphapis]

• offsetParent
  offsetTop
  offsetLeft

를 구현할려고 하니, FF에서는 IE와 틀리게 렌더링이 되는것 같네요..

제가 구현할려고 하는건..
특정 영역에 onmouseover가 되면, 그 영역을 기준으로 특정한 지역에
레이어가 보여지게 할려고 하는거에요..

예를들면..

Code: Select all

<div>
    <ul>
        <li>1번</li>
        <li>2번</li>
        <li>3번</li>
    <ul>
    <div>이게 보여줘야 되는 레이어</div>
</div>

이런구조인데, 각각 해당하는 li 위에 레이어를 보여주고 싶은거죠...

IE에서는 별 탈없이 진행했는데..
FF에서 돌려보니 영..꽝으로 나오네요..

• pageXOffset
  innerWidth
  scrollWidth

등등으로도 해보고,
상위 div의 display속성과, 저기에서 출력될 showDiv의 display속성도 absolute, relative 바꿔봐도 마찬가지네요..

그래서 꽁수로..Left의 좌표는 일정하니깐..
Left좌표 맞춰주고 Top 좌표 맞춰줄려고...
해봤는데, 이것 마저 만만치가 않네요..

Code: Select all

var x = document.body.offsetWidth / 2;
document.getElementById("showDiv").style.left = x;

이코드가 IE에서는 되는데 FF에서는 안되네요..

결국은 원점으로;;
부탁드립니다..ㅠ,.ㅠ

[hyeonseok]

hiphapis:

Code: Select all

var x = document.body.offsetWidth / 2;
document.getElementById("showDiv").style.left = x;

이코드가 IE에서는 되는데 FF에서는 안되네요..

결국은 원점으로;;
부탁드립니다..ㅠ,.ㅠ

document.getElementById("showDiv").style.left = x + "px";
단위가 빠져서 그런거 아닐까요?

[hiphapis]

document.getElementById("showDiv").style.left = x + "px";
단위가 빠져서 그런거 아닐까요?

아..제가

Code: Select all

document.getElementById("showDiv").style.left = xpx;

까진 해봤는데..-_-;
그렇게 생각은 못해봤네요..

막상 이렇게해서 돌려보니..
IE랑, FF랑 또 틀리게 나타나네요..;;

IE가 top 으로 부터 18px, left로 부터 2px 더 크네요..

[hiphapis]

XHTML 1.0 Trans 에서는 안되고
4.x 대에서는 잘 되네요..ㅡ.,ㅡ