순수 JS 작성 방법:
//offset()은 탐색을 기반으로 현재 요소의 위치를 가져옵니다.
var offsettop=$("#unamespan").offset().top
var offsetleft=$("#unamespan" ).offset ().left;
//position()은 상위 컨테이너
를 기반으로 현재 요소의 위치를 가져옵니다. var positiontop=$("#unamespan").position().top; ").position().left;
//unamespan 좌표를 기준으로 panel2의 위치 설정
$("#panel2").css({position: "absolute",'top ' :offsettop 100,'left':offsetleft 50,'z-index':2});
3 상대 요소는 일반 위치를 기준으로 상대적으로 배치된 요소를 생성합니다. 따라서 "left:20"은 요소의 왼쪽 위치에 20픽셀을 추가합니다.
4개의 정적 기본값. 위치 지정이 없으면 요소는 일반 흐름(상단, 하단, 왼쪽, 오른쪽 또는 Z-색인 선언 무시)으로 나타납니다.
5 상속은 위치 속성의 값이 상위 요소에서 상속되어야 함을 지정합니다. (이 속성은 IE에서는 지원되지 않습니다)
여러 레이어가 있고 레이어의 계층 관계를 설정해야 하는 경우 Z-index 속성을 설정해야 합니다
z-index 속성은 요소의 스택 순서를 설정합니다. 더 높은 스택 순서를 가진 요소는 항상 더 낮은 스택 순서를 가진 요소 앞에 나타납니다.
참고: 요소는 음수 Z-색인 속성 값을 가질 수 있습니다.
참고: Z-색인은 위치가 지정된 요소에서만 작동합니다(위치 값은 정적이지 않습니다)!
설명
이 속성은 표시 영역에 수직으로 확장되는 축으로 정의되는 z축을 따라 배치된 요소의 위치를 설정합니다. 양수이면 사용자에게 더 가깝고, 음수이면 사용자에게서 더 멀어집니다.