묻고답하기

안녕하세요. 선배님들.

제가 xpress 게시판에 아래와 같은 스크립트를 사용해 modal layer 팝업을 사용하고 있습니다.

페이지가 로드될 때 자동으로 뜨게 되어 있는데, 여기에 10초 후 자동으로 닫게 하는 방법을 알고 싶습니다.

"setTimeout()"를 활용해서 닫기가 가능한 것 같은데, 제가 코드엔 문외한이라 너무 어렵네요.

선배님들의 고견 부탁 드립니다. 제발요오~

 

--- 현재 사용하고 있는 코드

        <style>
            * {
                margin:0; 
                padding:0;
            }

            #overlay {
                position:fixed; 
                top:0;
                left:0;
                width:100%;
                height:100%;
                background:#000;
                opacity:0.8;
                filter:alpha(opacity=20);
            }

            #modal {
                position:absolute;
                background:rgba(0,0,0,0.2);
                border-radius:14px;
                padding:0px;
            }

            #content {
                border-radius:8px;
                background:#fff;
                padding:10px;
            }

            #close {
                position:absolute;
                background:url(../layer/close_.png) 0 0 no-repeat;
                width:1px;
                height:1px;
                display:block;
                text-indent:-9999px;
                top:-7px;
                right:-7px;
            }
        </style>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script>        
            var modal = (function(){
                var 
                method = {},
                $overlay,
                $modal,
                $content,
                $close;
                                
                // Center the modal in the viewport
                method.center = function () {
                    var top, left;

                    top = Math.max($(window).height() - $modal.outerHeight(), 0) / 2;
                    left = Math.max($(window).width() - $modal.outerWidth(), 0) / 2;

                    $modal.css({
                        top:top + $(window).scrollTop(), 
                        left:left + $(window).scrollLeft()
                    });
                };

                // Open the modal
                method.open = function (settings) {
                    $content.empty().append(settings.content);

                    $modal.css({
                        width: settings.width || 'auto', 
                        height: settings.height || 'auto'
                    });

                    method.center();
                    $(window).bind('resize.modal', method.center);
                    $modal.show();
                    $overlay.show();
                };

                // Close the modal
                method.close = function () {
                    $modal.hide();
                    $overlay.hide();
                    $content.empty();
                    $(window).unbind('resize.modal');                    
                };

                // Generate the HTML and add it to the document
                $overlay = $('<div id="overlay"></div>');
                $modal = $('<div id="modal"></div>');
                $content = $('<div id="content"></div>');
                $close = $('<a id="close" href="#">close</a>');

                $modal.hide();
                $overlay.hide();
                $modal.append($content, $close);

                $(document).ready(function(){
                    $('body').append($overlay, $modal);                        
                });
                
                $close.click(function(e){
                    e.preventDefault();
                    method.close();
                });

                return method;
            }());

            // Wait until the DOM has loaded before querying the document
            $(document).ready(function(){

                $.get('../layer/ajax.html', function(data){
                    modal.open({content: data});
                });

            });
        </script>

태그 연관 글
  1. [2016/12/21] 묻고답하기 고수님들 제발 도와주세요. 창크기에 따라서 위젯 위치가 자꾸 변합니다 by 립샤 *1
  2. [2015/12/14] 묻고답하기 스크롤 따라다니는 퀵메뉴 배너 by 오픈퀴어 *3
  3. [2015/11/24] 묻고답하기 메뉴바를 길게하고자 합니다 by thdwjdtjr *1
  4. [2015/07/16] 묻고답하기 jQuery 질문 by boy2
  5. [2015/05/23] 묻고답하기 쌩초보의 허접한 질문... 외부페이지 연결 by 티처킴
글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
매드 xe 문의드립니다. [2] 2016.01.14 by 매드
키킥c0302 안녕하세요 다운로드 질문드립니다. [2] 2016.01.14 by 키킥c0302
뀨뀨귱뀨뀨 xe 설치폴더를 옮기고 싶습니다. [6] 2016.01.14 by 뀨뀨귱뀨뀨
보소보소 마켓플레이스 재등록 표시 삭제 방법 [2] file 2016.01.13 by 보소보소
I-JEX DB를 사용하지 않는 게임과 XE의 연동이 가능할까요? [1] 2016.01.13 by DoorWeb
핫산123 홈페이지 도메인 변경후에 관리자페이지가 안들어가지는대요 [1] 2016.01.13 by I-JEX
쭌포토 Err : '' template file does not exists. 문제 [5] 2016.01.13 by 쭌포토
후니아빠 "요청한 기능을 실행할 수 있는 권한이 없습니다" - 스마트폰에서 게시판 접속시 file  
아로고 게시판 글이 사라졋네요 [3] file 2016.01.13 by 퍼니엑스이
미스터강 최신코어 스케치북 썸네일 나오나요? [2] 2016.01.13 by 돼지코구뇽
정배님 php파일이 특정한 웹에서만 사용가능하도록 설정할 수 있나요ㅛ? [1] 2016.01.13 by GG
마사요시김 로그인 이후 회원정보 리스트 선택가능여부 [2] file 2016.01.13 by 마사요시김
정배님 사이트 보안과 관련된 질문  
jw 메뉴 추가가 안돼요ㅠㅠㅠ file  
月浦 모바일 스케치북게시판에서 ckeditor로 글쓰기 [1] 2016.01.12 by 月浦
마꼬꼬 NGINX에서 메일이 보내지지 않습니다.  
블링블링 소시랑 익명 메모장에서 관리자만 닉네임 확인하고 싶어요  
uri3 Nginx Rewrite 설정 질문  
ckdmswl**** 몇가지 질문이있습니다. [2] file 2016.01.12 by ckdmswl****
ryudot 모바일 게시판에서 알림창 문제  
mofatz 홈페이지 속도 저하 및 관리자 로그인 안되는 현상(수정) [4] file 2016.01.12 by mofatz
부산민지아빠 xe_migration 0.6 버전 [1] 2016.01.12 by 퍼니엑스이
프라임 방문자 통계 질문입니다.. [4] 2016.01.12 by 프라임
꾸링 1.7.8 업데이트후 한글깨짐 [2] file 2016.01.12 by 하얀개미
하얀개미 한글깨짐현상[필독]  
jhl2623 모바일 웹 사이즈에 대해 질문드립니다. [4] file 2016.01.12 by jhl2623
얌얌 기본 레이아웃 게시판 가운데정렬 [3] 2016.01.12 by EISOFT
@.@뀨 사이트 디자인 설정이 안 됩니다  
최미경 xe 공지글 공개로 설정하기 질문드려요~  
PLS (재업) SNS 로 보내기 할 때, 페이스북에서 이미지가 안나옴