[해피CGI][cgimall] Youtube 영상을 백그라운드 배경으로 사용하기

YouTube 동영상을 표지 배경으로 삽입 가능한 가볍고 간단한 jQuery 플러그인입니다.

해당 플러그인은 YouTube 동영상 임베딩 API를 사용하여 동영상을 가져와 웹 페이지 (또는 특정 div) 배경으로 재생합니다.

HTML5 데이터 속성에 비디오 URL을 추가하기 만하면이 플러그인이 해당 비디오를 배경으로 자동 설정합니다.

모든 크기 및 기간으로 비디오를 추가 할 수 있으며 사용 가능한 화면 크기로 크기가 조정됩니다.

그리고 배경 비디오는 반복 재생됩니다.



라이센스는 MIT Licence 입니다.


Youtube 영상을 가져와서 보여주려면 사용하는 도메인은 SSL 보안인증서가 장착된 HTTPS 도메인에서만 사용 가능 합니다.



사용법 안내 입니다.

<style>

/* optional css fade in animation */

iframe {

           transition: opacity 500ms ease-in-out;

           transition-delay: 250ms;

}

<style>

 

<!-- target element -->

<div data-youtube="https://www.youtube.com/watch?v=eEpEeyqGlxA"><div>

 

<script type="text/javascript">

       jQuery(document).ready(function() {

              jQuery('[data-youtube]').youtube_background();

       });

<script>