반응형 유튜브 플레이어(모바일호환)

안녕하세요 두리삼촌입니다. 오랜만에 여러분께 인사드립니다.
이번에는 유튜브 플레이어를 모바일 환경에서 사용할수 있도록
반응형으로 수정하여 재배포 합니다.

파일은 모두 두가지 입니다.

첫번째 파일은 euc kr

두번째 파일은 utf-8 버전입니다. 그누보드 사용자 분들은 대부분 utf-8 문자셋이나

간혹 php의 버전문제로 euc-kr 버전이 필요한분도 계실듯해서 두가지로 올립니다.

01. 유튜브 영상의 가로 및 세로 크기 수정.
list_01.php등과 같은 파일을 편집기로 열어서 보시면
222번과 223번줄에 전체 가로와 세로 크기를 설정하는 부분이 있습니다.

 {
  playlistOptions: {
   autoPlay: true },
  supplied: "webmv, ogv, m4v, oga, mp3",
  size: {
   width: "100%",
   height: "210px",
   cssClass: "jp-video-360p"
  },
  smoothPlayBar: true,
  keyEnabled: false });

위 부분을 수정하시면 됩니다.

02. 플레이어를 출력하는 리스트 페이지의 수정.
index.php를 포함한 각 플레이어 출력파일 play_01.php 부터 play_05.php 파일 속성에서

13번째줄   max-width: 100%; 부분을 수정하시면 됩니다.

03. 유튜브 영상의 Responsive(반응형) 크기설정.

     dist/skin/blue.monday/css/jplayer.blue.monday.css 를 편집기등으로 여신후

     49번줄 width: 100%;

     53번줄 width: 100%; 와 같이 수정하시면 브라우저의 크기와 관계없이

     영상이 각각 크기에 맞춰 반응형으로 보여집니다.

04. 플레이어의 폰트사이즈
dist/skin/blue.monday/css/jplayer.blue.monday.css 를 편집기등으로 여신후

32번째줄
  font-size: 21px; 부분을 수정해주세요

기타 궁굼하신 사항은 댓글을 남겨주세요.

감사합니다. 곧 PC버전도 반응형으로 수정하여 다시 찾아뵙겠습니다.