RadarURL

logo

  • 홈으로
  • 로그인
  • 회원가입
  • 화면축소
  • 화면확대
2021년 10월 24일
  • 포토누리
  • 제작의뢰
  • 포트폴리오
백반증 수술 sst전층피부이식술
로그인
2021.06.25 10:58

모달 팝업창 소스

조회 수 124 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print
<script src="https://code.jquery.com/jquery-latest.js"></script> 
 
    <style>
        /* The Modal (background) */
        .modal {
            display: none; /* Hidden by default */
            position: fixed; /* Stay in place */
            z-index: 1; /* Sit on top */
            left: 0;
            top: 0;
            width: 100%; /* Full width */
            height: 100%; /* Full height */
            overflow: auto; /* Enable scroll if needed */
            background-color: rgb(0,0,0); /* Fallback color */
            background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
z-index:100000000;
        }
    
        /* Modal Content/Box */
        .modal-content {
            background-color: #fefefe;
            margin: 3% auto; /* 15% from the top and centered */
            padding: 20px;
            border: 1px solid #888;
            width: 1200px; /* Could be more or less, depending on screen size */                          
        }
 
</style>

<div id="myModal" class="modal">
 
<!-- Modal content -->
<div class="modal-content">
<img src="images/staff2021_0621.png" alt="조직" style="width:100%;" />
<div style="cursor:pointer;background-color:#DDDDDD;text-align: center;padding-bottom: 10px;padding-top: 10px;" onClick="close_pop();">
<span class="pop_bt" style="font-size: 13pt;" >
 닫기
</span>
</div>
</div>

</div>
<!--End Modal-->

<script type="text/javascript">

function open_pop(flag){
    $('#myModal').css('display','block');
};



function close_pop(flag) {
 $('#myModal').hide();
};

</script>
 

 

<a href="#" onClick="open_pop();"> 팝업창 열기</a>

?

List of Articles
번호 제목 글쓴이 날짜 조회 수
» 모달 팝업창 소스 똑띠 2021.06.25 124
64 query로 높이(height)와 넓이(width)를 측정하는 모든 방법 똑띠 2021.05.07 118
63 브라우저 스크롤 값 체크 똑띠 2020.04.27 330
62 이미지를 새창으로 띄우기 똑띠 2017.10.27 2902
61 input 타입에 숫자만 입력 받기 똑띠 2017.08.24 1267
60 iframe에 타켓주기 똑띠 2017.08.14 1564
59 스크롤 페이지 이동 똑띠 2017.02.11 1433
58 input 입력값 자동 더하기 똑띠 2016.05.13 10527
57 confirm 창 활용 똑띠 2016.01.20 716
56 select form 에서 submit 버튼 클릭시 사이트 이동 똑띠 2013.04.26 136555
55 form문에서 submit 시 action 처리 window.open 으로 하기 4 똑띠 2013.01.03 145501
54 iframe 배경 투명하게 처리하기 똑띠 2012.11.05 67344
53 함수호출, 조건별 처리 똑띠 2012.09.04 70483
52 check박스 체크 여부 확인하기 똑띠 2012.06.07 85141
51 웹접근성을 해치지 않으면서 자바스크립트 사용하기 똑띠 2012.01.12 68454
50 특정태그 제거 똑띠 2011.10.13 77851
49 크로스 사이트 스크립트 1 똑띠 2011.09.01 94771
48 좌측 숨김 슬라이드메뉴 file 똑띠 2011.08.19 71063
47 input 에 배경으로 글자입력하고 클릭시 사라지는 기능 똑띠 2011.08.01 168380
46 접속시 배경이미지 랜덤으로 보여주기 똑띠 2011.07.26 71749
목록
Board Pagination ‹ Prev 1 2 3 4 Next ›
/ 4

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

  • Designed by jobdahan.net