http://dimsemenov.com/plugins/magnific-popup/

Magnific Popup JQuery  팝업 다이얼로그 등을 쉽게 처리할수 있습니다.

라이센스는 MIT 라이센스로 마음껏 사용해도 될듯 합니다.

  : The MIT License (MIT)

사이트에서 보니 동영상, 지도 등등 여러가지 다양하게 지원하네요~

1. github 에서 다운로드 합니다. 지금 1.1.0 버전이 최신버전이네요~

  : https://github.com/dimsemenov/Magnific-Popup/releases

Magnific-Popup-1.1.0.zip

2. 사용하기 위해선 jsp 파일에 magnific-popup js 및 css 를 추가해줍니다.

 : Magnific-Popup-1.1.0.zip\Magnific-Popup-1.1.0\dist\ 경로에 있습니다.

  jquery 도 있어야 합니다.( jquery.min.js )

<!-- Magnific Popup core CSS file -->
<link rel="stylesheet" href="magnific-popup/magnific-popup.css">

<!-- jQuery 1.7.2+ or Zepto.js 1.0+ -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<!-- Magnific Popup core JS file -->
<script src="magnific-popup/jquery.magnific-popup.js"></script>

3. 기본적인거 하나 호출해 보겠습니다. 아무거나 이미지 불러오기 테스트.

js  : $("#testPop").magnificPopup({type: 'image'});

jsp : <a id="testPop" href="https://s.pstatic.net/static/www/img/2017/sp_main_v170424.png">Open popup</a>

4. 여러가지 옵션등이 있습니다. 적용해 보도록 합시다. 

사용법 옵션 등은 이곳에서 확인해 보면 됩니다.

http://dimsemenov.com/plugins/magnific-popup/documentation.html

아주 편리하네요 좋습니다~

끝~