TIP게시판
| 웅파 |  0  259  0
0
 2012-01-11 19:02:08 |
|---|---|
var aa = (document.body.scrollTop + (window.innerHeight/2)) ;
var x = (window.innerWidth - wW) / 2 ;
var y = (aa - (wH / 2));
wW와 wH는 화면에 뜨는 팝업창의 크기입니다. Y를 구하는 공식 : aa의 값은 document.body.scrollTop : 현재 스크롤의 위치값 window.innerHeight : 메뉴바, 툴바 등을 뺀 브라우저의 높이 현재 스크롤의 위치값에 순수화면값의 절반을 더하면 현재 화면의 중앙 값이 구해집니다. (스크롤을 하더라도 현재 화면의 중앙값 계산됩니다.) 거기에 화면에 뜨는 팝업창 높이의 1/2을 빼면 팝업창이 위치할 Y축이 구해집니다. X는 고정된 값이기 때문에 계산하기가 쉽습니다. 순수 화면크기값에서 팝업의 width를 뺀 값의 1/2이 X축 중앙이 됩니다. 검색하다 안나와서 그림 그려가면서 로직 만들었네요. (분명 있을건데... ㅎㅎㅎㅎ) 어쨌든 팝업의 크기에 상관없이, 스크롤 위치에 상관없이 현재 화면의 정 중앙에 팝업창이 위치합니다. ^^ |
|
추천
신고| 번호 | 제 목 | 글쓴이 | 날짜 | 조회 | 추천수 |
|---|---|---|---|---|---|
| 836 | Hook을 이용한 preload 이이지 구현에 대한.. [2]  |
핵잠함장 | 2012-02-22 | 18 | 0 |
| 833 | CI_Cache_memcached 드라이버 버그 수정 [2] |
한글이 | 2012-02-22 | 25 | 0 |
| 829 | HMVC 5.4 & Template_ 타로구조 만들기 [1] | 타로 | 2012-02-02 | 382 | 0 |
| 824 | CI lang팩 -> Javascript lang팩 [4] | KangMin | 2012-01-25 | 300 | 0 |
| 823 | anchor_popup 헬퍼 화면 정 가운데 띄우기.. [0] | DJ구스 | 2012-01-17 | 238 | 0 |
| 822 | [자바스크립트] 창을 화면 정중앙에 위치하게 계산하기 [0] | 웅파 | 2012-01-11 | 259 | 0 |
| 815 | hook에서 선언한 변수를 컨트롤러에서 사용하기 [2] | 웅파 | 2011-12-27 | 460 | 0 |
| 812 | mysql 부분적인 에러 핸들링 처리 [2] | EziX | 2011-12-20 | 478 | 0 |
| 811 | 컨트롤러 외부에서의 종료방법 [1] | EziX | 2011-12-20 | 371 | 0 |
| 809 | icodekore sms 모듈 쓰는 분들 참고하세요.. [0] | namGoos | 2011-12-09 | 592 | 0 |
| 803 | Upgrading from 2.0.3 to 2.1.0 [5] | namGoos | 2011-12-06 | 558 | 0 |
| 794 | .svn 폴더 삭제 하기 [7] | 불의회상 | 2011-11-30 | 554 | 1 |
| 792 | [1원] 윈도우서버+mssql 에서 CLI(Comm.. [2] | 터프키드 | 2011-11-29 | 540 | 0 |
| 786 | Form_validation 라이브러리 less_t.. [2] | EziX | 2011-11-17 | 506 | 0 |
| 780 | 1원팁. 저의 Template_ 이용방법입니다. [2] | namGoos | 2011-10-31 | 1137 | 0 |
| 773 | MYSQL 자동으로 시간 설정 [5] | 불의회상 | 2011-10-26 | 728 | 0 |
| 767 | 모바일 웹사이트 개발시 참조하시면 좋을 것 같네요~ [7] | 탱크 | 2011-10-20 | 864 | 1 |
| 764 | EUC-KR 판정 방법 [3] | 불의회상 | 2011-10-18 | 787 | 0 |
| 758 | eclipse Autocomplete 업데이트 버전. [4] | EziX | 2011-10-14 | 1068 | 0 |
| 751 | 글로벌 사이트를 위한 시간(GMT) 적용 [8] | 웅파 | 2011-10-12 | 580 | 0 |
