div layer 위치 Javascript
| 레이어 left,top ................................................. 레이어 위치를 잡으려면 left,top 을 사용한다. |
■ absolute 에서 본문내용의 원하는 위치에 레이어 놓기 * 아래는 같은 레이어를 3개의 칸을 가진 테이블에 넣어본 것이다. * table태그를 잘 활용하면 본문내용과 항상 일치하는 곳에 레이어를 사용할 수 있다. * left ,top 설정 없음! |
| <div id="Layer1" style="position:absolute; width:100px; height:50px; z-index:1; border: 1px dotted #ff33ff; visibility: visible;"></div> |
■ relative 에서는 본문내용 속에 레이어가 비집고 들어가므로 레이어 속의 내용이 그 사이에 들어와도 좋은 지를 보고 위치를 잡아야 한다. * left,top 으로 상위태그 기준으로 위치를 줄 수 있다. |
| <div id="Layer2" style="position:relative; width:200px; height:50px; z-index:1; border: 1px dotted #ff33ff; visibility: visible;" left:0 ; top:0></div> |
| 레이어 앞의 내용 레이어 뒤의 내용 |
| <div id="Layer2" style="position:relative; width:200px; height:80px; z-index:1; border: 1px dotted #ff33ff; visibility: visible;" left:30 ; top:30></div> |
| 레이어 앞의 내용 레이어 뒤의 내용 |
| relative인 경우 아래 예제는 상위 태그인 td에서 left로 30, top 에서 30 떨어진 곳에 위치하게 된다. left 값은 도움이 될 수 있지만 top 값은 내용과 이상한 배치가 일어날 수 있다. |
[이 게시물은 관리자님에 의해 2011-10-31 16:54:41 CSS에서 이동 됨]
댓글 2개
wooripet
18년 전
올.. 좋은.. 굿.. -_-;
garangnip
17년 전
잘 보고 갑니다. 처음 layer를 접하는데 큰 도움이 되었습니다.
게시글 목록
| 번호 | 제목 |
|---|---|
| 12007 |
기타
그라디언트
5
|
| 12006 | |
| 12005 | |
| 12000 |
Flash
일러스트 단축키
4
|
| 11994 |
Flash
[[ 플래시 MX 단축키 요약 ]]
5
|
| 11993 | |
| 11992 | |
| 11991 |
JavaScript
adduser 명령어 기본사용법
|
| 11990 |
MySQL
리눅스 자동백업
|
| 11989 | |
| 29203 | |
| 11988 |
Linux
Xinetd 설치하기&설명
|
| 11986 |
MySQL
mysql버전확인
1
|
| 11985 |
JavaScript
su, telnet, ftp 권한제한
|
| 11984 | |
| 11983 |
JavaScript
Portsentry 1.1 설치하기(실시간해킹방지프로그램)
|
| 11982 |
Linux
리눅스에서 휴지통 (safedelete)
|
| 29202 |
HTML
apache2 가상호스트 설정방법
|
| 29201 | |
| 24968 | |
| 11981 |
JavaScript
시작과 멈춤이 가능한 스크롤 텍스트
|
| 29200 |
HTML
이미지에 마우스만 올려도 링크로 이동
|
| 29198 | |
| 11979 | |
| 11978 |
Flash
php.ini정보
|
| 11975 |
JavaScript
Lightbox2 적용 방법
2
|
| 11973 |
기타
rpm 명령어
1
|
| 11972 |
기타
Trac 설치
|
| 11971 | |
| 11970 |
기타
META 태그 사용법
|
| 11966 | |
| 11962 |
MySQL
MySQL 다운로드
3
|
| 29197 | |
| 29196 |
HTML
간단PHP(4)
|
| 11961 |
기타
간단PHP(3)
|
| 11960 |
기타
간단PHP(2)
|
| 11959 |
JavaScript
간단PHP(1)
|
| 11958 | |
| 11956 | |
| 11952 | |
| 11948 |
JavaScript
[질문] 페도라리눅스에서 한글깨짐현상
3
|
| 11944 | |
| 11936 | |
| 11935 | |
| 29195 | |
| 11934 |
JavaScript
포토샵 CS3에서 JPG 파일을 RAW 파일처럼 보정하기 - 사진 후보정
|
| 29191 | |
| 11933 |
JavaScript
[소스] 배경이미지 바꾸기 (PHP에서)에 대한 초보
|
| 29186 | |
| 11932 |
Flash
플래쉬쪽에서의 파일업로드
|
| 11931 |
Flash
플래쉬에서 PHP와 연동하면서 파일 업로드
|
| 11926 |
Flash
초보가 올리는 왼쪽 메뉴(허접)
4
|
| 11922 | |
| 29183 | |
| 11920 | |
| 11916 | |
| 11915 | |
| 11913 |
JavaScript
타일 이미지 멥핑
1
|
| 11910 | |
| 29182 |
HTML
브러쉬만들기
|
| 11904 | |
| 11901 |
기타
눈물만들기
2
|
| 11900 | |
| 29181 |
HTML
말랑말랑 젤리 텍스트
|
| 11898 | |
| 29179 |
HTML
간단하게 수채화 느낌 내기
1
|
| 11894 |
JavaScript
htmlspecialchars() 역변환(반대) 함수
3
|
| 11892 | |
| 11890 |
JavaScript
배경이미지 바꾸기 (PHP에서)
1
|
| 11889 |
JavaScript
검색창 추가
|
| 11888 | |
| 11886 |
기타
질문입니다
1
|
| 11883 | |
| 11879 | |
| 11875 | |
| 29178 |
HTML
팝업소스 관련질문-오늘하루창안열기
|
| 29167 |
HTML
자바스크립으로 플래쉬 메뉴처럼
10
|
| 11874 |
JavaScript
글씨의 색을 자동으로 변환시켜주는 함수
|
| 29166 | |
| 11872 | |
| 11870 |
JavaScript
[스크립트] 이미지 리사이징
1
|
| 11867 | |
| 11866 | |
| 11865 |
MySQL
MySQL에서 Query Cache 사용하기
|
| 29165 |
HTML
색상표
|
| 29162 |
HTML
입출력폼 생성기
2
|
| 11861 |
MySQL
무료 웹방화벽 Modsecurity..!
3
|
| 11851 |
MySQL
리눅스 포기 하고 싶습니다.. ㅠ.ㅠ
9
|
| 11850 | |
| 11847 | |
| 11846 | |
| 11845 |
JavaScript
ucc(동영상) 서비스 운영관련 자료 (키워드 ffmpeg)
|
| 11840 | |
| 11826 | |
| 11825 |
MySQL
MySQL 한글 정렬 Tip
|
| 11823 |
기타
외부문서불러오기
1
|
| 11816 | |
| 11808 |
Flash
플래시 메뉴 소스
7
|
| 11805 | |
| 11804 |
JavaScript
<script>
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기