회원가입,로그인 모달

회원가입,로그인 모달

QA

회원가입,로그인 모달

본문

회원가입이랑 로그인을 모달로 만들고 싶은데 스킨 뭐없을까요?

 

현재 모달로 회원가입을 만들어놨는데

아무래도 아이프레임으로 불러와서..

회원가입결과도 아이프레임 사이즈안에서만 구현되고 이상해서요..

아니면 회원가입작성폼에서 완료를 누르면 자동으로 모달창이 닫히게는 못할까요

 

<div class="setDiv more_benefit"> 
                <a href="#" class="showMask"><img src="/thema/Basic/img/man.png"> 회원가입 </a>
             
                <div class="mask"></div>
                <div class="window">
                    <div style="position:relative">
                    <input type="button" href="#" class="close" value="x"/>
                    <div class="benefit1">
                         <iframe style="width:350px; height:1000px; "  src="/bbs/register_form.php"</iframe>
                      </div> 
                </div>
            </div>

 

 

 

 

<script type="text/javascript">
    function wrapWindowByMask(){
        // 화면의 높이와 너비를 변수로 만듭니다.
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();
 
        // 마스크의 높이와 너비를 화면의 높이와 너비 변수로 설정합니다.
        $('.mask').css({'width':maskWidth,'height':maskHeight});
 
        // fade 애니메이션 : 1초 동안 검게 됐다가 80%의 불투명으로 변합니다.
        $('.mask').fadeIn(500);
        $('.mask').fadeTo("slow",0.6);
 
        // 레이어 팝업을 가운데로 띄우기 위해 화면의 높이와 너비의 가운데 값과 스크롤 값을 더하여 변수로 만듭니다.
        var left = ( $(window).scrollLeft() + ( $(window).width() - $('.window').width()) / 2 );
        var top = ( $(window).scrollTop() + ( $(window).height() - $('.window').height()) / 2 );
 
        // css 스타일을 변경합니다.
        $('.window').css({'left':left,'top':top, 'position':'absolute'});
 
        // 레이어 팝업을 띄웁니다.
        $('.window').show();
    }
 
    $(document).ready(function(){
        // showMask를 클릭시 작동하며 검은 마스크 배경과 레이어 팝업을 띄웁니다.
        $('.showMask').click(function(e){
            // preventDefault는 href의 링크 기본 행동을 막는 기능입니다.
            e.preventDefault();
            wrapWindowByMask();
        });
 
        // 닫기(close)를 눌렀을 때 작동합니다.
        $('.window .close').click(function (e) {
            e.preventDefault();
            $('.mask, .window').hide();
        });
 
        // 뒤 검은 마스크를 클릭시에도 모두 제거하도록 처리합니다.
        $('.mask').click(function () {
            $(this).hide();
            $('.window').hide();
        });
    });
</script>
 

이 질문에 댓글 쓰기 :

답변 2

iframe으로 하시려면 

parent 쪽에 창을 닫는 javascript function을 하나 만들어두고

해당 frame이 닫히기전에 parent 함수를 호출하는 방식으로 처리할 수는 있습니다만

구조도 복잡하고 테스트도 어렵고 잘 하지 않는 방법입니다.

애초에 iframe을 쓰기 시작하면 그런 컨트롤이 어렵고 복잡해질 각오를 해야되는거죠 

답변을 작성하시기 전에 로그인 해주세요.
전체 122,919 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT