[jQuery] Magnific Popup > 기술자료 | 해피정닷컴

[jQuery] Magnific Popup > 기술자료

본문 바로가기

사이트 내 전체검색

[jQuery] Magnific Popup > 기술자료

JavaScript [jQuery] Magnific Popup

페이지 정보


본문

실무에서 사용하기 좋은 팝업 플러그인

플러그인 다운로드 : http://dimsemenov.com/plugins/magnific-popup/


<link rel="stylesheet" href="./js/magnific-popup.css">', 0);
?>
<script src="./js/jquery.magnific-popup.min.js"></script>
<style type="text/css">
  /**
   * Simple fade transition,
   */
  .mfp-fade.mfp-bg {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out; 
    -moz-transition: all 0.15s ease-out; 
    transition: all 0.15s ease-out;
  }
  .mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.8;
  }
  .mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
  }

  .mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out; 
    -moz-transition: all 0.15s ease-out; 
    transition: all 0.15s ease-out;
  }
  .mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
  }
  .mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
  }
</style>
<script type="text/javascript">
  $(document).ready(function() {
    $('.popup-youtube, .popup-vimeo, .popup-gmaps').magnificPopup({
      disableOn: 700,
      type: 'iframe',
      mainClass: 'mfp-fade',
      removalDelay: 160,
      preloader: false,

      fixedContentPos: false
    });
  });
</script>


<a href="https://www.youtube.com/watch?v=BzYnNdJhZQw" class="popup-youtube">동영상링크</a>



참고자료
http://demun.tistory.com/2440
 

댓글목록

등록된 댓글이 없습니다.


Total 2,634건 21 페이지
  • RSS
기술자료 목록
2234
Linux   6865  2018-07-13 18:29  
2233
XpressEngine   7046  2018-07-13 18:22 ~ 2018-07-13 21:51  
2232
MySQL   9458  2018-07-12 12:40 ~ 2018-07-12 12:44  
열람
JavaScript   10070  2018-07-12 00:09  
2230
일반   11556  2018-07-09 17:13 ~ 2018-07-11 17:27  
2229
HTML   7379  2018-07-04 23:27  
2228
HTML   8312  2018-07-04 15:02  
2227
테크노트   9874  2018-07-02 21:39 ~ 2022-04-21 02:58  
2226
Search   12135  2018-07-01 02:38 ~ 2018-07-01 02:41  
2225
일반   8333  2018-06-27 23:32 ~ 2018-07-04 23:09  
2224
그누보드   7346  2018-06-19 14:54  
2223
XpressEngine   9550  2018-06-12 13:08 ~ 2022-04-21 02:49  
2222
XpressEngine   8754  2018-06-11 20:24  
2221
호스팅   8086  2018-06-11 02:56 ~ 2018-10-10 16:30  
2220
XpressEngine   6279  2018-06-11 01:30  
2219
XpressEngine   11709  2018-06-08 00:32 ~ 2018-06-12 16:36  
2218
호스팅   8106  2018-06-07 15:44 ~ 2021-05-03 19:05  
2217
그누보드   9959  2018-06-06 23:53 ~ 2018-06-07 09:41  
2216
영카트   13937  2018-06-05 17:56 ~ 2018-06-05 21:36  
2215
XML   9009  2018-06-05 14:14 ~ 2018-06-05 14:15  

검색

해피정닷컴 정보

회사소개 회사연혁 협력사 오시는길 서비스 이용약관 개인정보 처리방침

회사명: 해피정닷컴   대표: 정창용   전화: 070-7600-3500   팩스: 042-670-8272
주소: (34368) 대전시 대덕구 대화로 160 대전산업용재유통단지 1동 222호
개인정보보호책임자: 정창용   사업자번호: 119-05-36414
통신판매업신고: 제2024-대전대덕-0405호 [사업자등록확인]  
Copyright 2001~2024 해피정닷컴. All Rights Reserved.