[bideo.js] GitHub 뒤지기 2

GitHub 뒤지기 - 2

rishabhp / bideo.js

---

-    소개

html5 비디오 태그를 자바스크립트 상에서 다룰 수 있게 해주는 백업형 라이브러리.

사실 조금만 익숙해지면 가능한 기술이지만 bideo.js 는 이 수고로움을 덜어준다.

링크: https://github.com/rishabhp/bideo.js

-   구성

bideo.js

-    공식 예제

https://rishabhp.github.io/bideo.js/

-    사용법 (by 한솔)

수행하는 역할이 굉장히 한정적인지라 자세한 사용법이 필요하진 않다.

video 태그와 동일하다고 생각하고 작업하면 편할 것이다.

bideo.js 는 두가지 Element 를 컨트롤하게 되는데 이는 video 와 그를 감싸는 Element 이다.

다음은 video Element를 컨트롤 할 스크립트 부분이다.

주석에 설명해 놓았듯이 저게 끝이다.

Bideo 클래스를 init 시키는 행위는 video Element 에 Source 를 넣어주고, 플레이시키며 비디오를 감싸는 컨테이너에 따라 리사이즈(옵션) 되도록 한다.

여기서 개발자는 비디오가 로드된 후 옵션을 위해서 onLoad 콜백도 따로 빼놓은 듯 하다.

-    활용

백그라운드에 비디오를 깐다던지, 혹은 움직이는 프로필을 만든다던지의 활용이 가능할 것이다.

공식 예제 페이지에서는 CSS 로 동영상을 페이지 전체 백그라운드로 사용하였다.

http://www.pizzamaru.co.kr/

bideo.js 를 사용하진 않았지만 '피자마루' 홈페이지의 푸터영역도 이 라이브러리로 개발이 가능할 듯 하다.