function getAbsoluteTop(oNode){
var oCurrentNode=oNode;
var iTop=0;
while(oCurrentNode.tagName!="BODY"){
iTop+=oCurrentNode.offsetTop - oCurrentNode.scrollTop;
oCurrentNode=oCurrentNode.offsetParent;
}
return iTop;
}
해당 창(viewport 라고 하던가요?)에 잇는 엘리먼트의 위치를 픽셀 값으로 얻어오고 싶은데 아무리 고민해도 답이 안나오더군요. 혹시나해서 다음 플래닛에 있는 팝업 구현 함수를 들여다 보니 위와 같더군요. 저 함수에서는 scrollTop과 offsetTop 을 이용해서 구하고 있네요. 제가 알기로 scrollTop은 IE 전용 프로퍼티인걸로 알고 있는데 scrollTop을 이용하는 방법 이외에 다른 방법은 없을까요?
그리고 anchor 태그의 href 속성 값에 href="javascript:void(0);" 와 같이 넣는 방법이 올바른 것인지 궁금합니다. overlib 라이브러리 문서를 보면 저렇게 처리를 했던데 아무리봐도 트릭 같아서요. href="#" 값을 넣으니 클릭후에 제일 위로 스크롤 되버리고, span 태그를 쓰고 style 속성에 cursor 프로퍼티를 넣으려니 익스플로러 5.X 이하가 문제가 되는군요.
어떤 용도로 위치를 사용하시려고 하는지 글에는 나와있지 않아서 완전히 알 수는 없으나..제 생각에는 browser-sniffing 없이는 불가능 한 것 같습니다.
CSS 에는 position: fixed; 라는 훌륭한 property 가 있습니다. 이것을 사용하면 픽셀을 알아올 필요가 없지 않나...싶습니다. 단 IE 에서는 지원이 안됩니다. IE 에서 position: fixed 를 구현한 js 파일이 있습니다. 저같은 경우는 이 javascript 를 사용하여 해결했습니다.
href="javascript:void(0);" 는 사용 안하는 것이 좋을 것 같습니다. href 는 말그대로 hypertext 정보를 알려주는 것입니다. javascript:~~~ 는 hypertext 가 아니죠. 그래서, cursor: pointer 를 사용하고 onclick에 javascript 를 넣는것이 좋다고 생각합니다.
저같은 경우 IE5 는 버렸습니다. 누가 뭐라고 하면 발표된지 너무나 오래 되었고, 보안에도 취약한 사용해서는 안되는 브라우져 라고 약간 과장하여 일축해 버립니다. -o-;;;;
임의의 위치에서 상대 위치를 찾기 위해서는 javascript 를 사용하지 않고서도 가능합니다.
position 을 사용하시면 됩니다.
position: relative; 나 absolute block 안에 position: absolute 속성을 사용하게 되면 origin 이 화면의 scroll 이 아닌, 상위의 position: relative 나 absolute block 의 것을 따르게 됩니다. 즉, 임의의 엘리먼트에서의 위치 지정이 가능하게 됩니다.
IE 에서는 상위 block 의 width 나 height 가 지정이 되어 있어야 정상적으로 작동합니다.
