| ||||
카페의 대문에 태그로 음악올리기| 태그연습 | ||||
유투브 동영상 재생 옵션..
유튜브 재생 소스 HTML에 있는 옵션의 뜻을 이해하면 유용하게 사용할수 있습니다.
1. 기본값이란 특별히 옵션을 설정해두지 않아도 자동으로 설정되어 있는 값을 뜻합니다.
2. 옵션값들은 반드시 "소문자" 로 작성해주세요. 그렇지 않으면 작동하지 않습니다.
◆ 사용방법
반드시 앞에 &를 넣고 띄어쓰기 없이 사용함
예시 : src=" " 중 " " 안에서는 띄어쓰기를 하지 안음.
<embed src="//www.youtube.com/v/up-Xz5xJymM?hl=ko_KR&version=3&rel=0&autoplay=1"
위 동영상 소스 html을 보면
up-Xz5xJymM 는 동영상 고유의 주소이고
?hl=ko_KR&version=3 는 기본적으로 제공되며(version=3를 version2로 바꿀수는 있음)
&rel=0&autoplay=1 는 옵션으로서 그뜻은
앞의 &rel=0(동영상 재생 완료후 관련동영상(related videos)을 뜨지않게, 만약 0 대신에 1 을 쓰면 관련동영상이 뜨고 )
뒤의&autoplay=1(자동으로 재생되게, 1대신에 0을 넣르면 수동 재생 됨)
따라서 이 동영상은 version3를 사용하고, 처음에 삼각형 바(수동재생 바) 없이 자동 재생되며, 프레이가 끝나고 나서는 관련 동영상이 뜨지 않게 해 놓은 것입니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
◆ 기타 재생옵션과 내용
<!--[if !supportEmptyParas]--> <!--[endif]-->
&autohide=1 (이 환경에서 지원됨 : AS3,AS2,HTML5)
• 기본값 : 1
• 옵션값 : 0
플레이어에 마우스를 올려놓지 않았을 때 시간이 지나면 자동으로 재생바와 제목바를 숨겨줌
<!--[if !supportEmptyParas]--> <!--[endif]-->
&autoplay=0 (이 환경에서 지원됨 : AS3,AS2,HTML5)
• 기본값 : 0 -수동재생
• 옵션값 : 1
동영상을 사용자가 재생시키지 않아도 자동으로 재생되게끔 합니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&cc_load_policy=0 (이 환경에서 지원됨 : AS3,AS2)
• 기본값 : 0
• 옵션값 : 1
만일 유튜브 자막옵션이 지원되는 경우 옵션값인 "1"로 설정해두면 재생 시 자동으로 자막옵션이 켜져서 같이 나오게 됩니다.
기본값은 자동으로 나오지 않게 되어있지만 사용자가 자막버튼으로 켜고 끌 수는 있습니다.
&color=red (이 환경에서 지원됨 : AS3,HTML5)
• 기본값 : red
• 옵션값 : white
재생막대바의 색상을 지정합니다. 일반적으로 기본값인 red가 가장 많이 쓰이긴 하지만 white로 바꿔 줄 경우
재생막대바 색상이 붉은색에서 흰색으로 나오게 됩니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&controls=1 (이 환경에서 지원됨 : AS3,HTML5)
• 기본값 : 1
• 옵션값 : 0 또는 2
0 = 플레이어의 재생바를 감춰버립니다. 이것은 autohide 옵션과 달리 영구적으로 감춰버리기 때문에 동영상을 보는 사람들이 마우스로 재생지점을 설정할 수 없게 됩니다.
하지만 특별히 키보드사용설정을 막지 않았다면 방향키로는 탐색지점을 움직일 수 있습니다.
1 = 특별히 이 옵션을 지정하지 않았다면 "1" 수치가 기본값으로 지정됩니다.
재생바를 보여주고 재생버튼을 누르는 그 순간부터 실시간으로 동영상 데이터를 미리 받아와서 끊김없이 감상할 수 있게 해줍니다. 동영상을 잠시 정지해놓고 있어도 데이터는 계속해서 받아옵니다.
2 = 재생바를 보여준다는점은 1과 비슷하지만 이 옵션은 데이터를 오로지 동영상이 재생중일때만 미리 받아옵니다.
일지정지를 시키게 되면 데이터를 미리받아오지 않기때문에 영상을 받아오는 속도가 늦는다면 계속해서 버퍼링이 걸리게 됩니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&disablekb=0 (이 환경에서 지원됨 : AS3,AS2)
• 기본값 : 0
• 옵션값 : 1
옵션값인 1 로 지정할 경우 플레이어에서 키보드를 사용할 수 없게 됩니다.
유튜브 플레이어에서 작동하는 키 값은 아래와 같습니다.
스페이스바 : 재생 / 일지정지
오른쪽 방향키 : 총 영상길이의 10%만큼 앞으로
왼 쪽 방향키 : 총 영상길이의 10%만큼 뒤로
위 쪽 방향키 : 볼륨 키우기
아래쪽 방향키 : 볼륨 줄이기
<!--[if !supportEmptyParas]--> <!--[endif]-->
&start=0 (이 환경에서 지원됨 : AS3,AS2,HTML5)
. 기본값 : 없음
• 옵션값 : 사용자지정
동영상의 시작지점을 정할 수 있습니다. 단위는 "초" 이며 만일 50으로 지정할 경우 동영상의 50초 부분에서부터 시작합니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&end=0 (이 환경에서 지원됨 : AS3)
• 기본값 : 없음
• 옵션값 : 사용자지정
동영상의 끝 지점을 정할 수 있습니다. 단위는 "초" 이며 만일 15로 지정할 경우 동영상의 15초 부분에서 재생이 끝나게 됩니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&fs=1 (이 환경에서 지원됨 : AS3,AS2)
• 기본값 : 1
• 옵션값 : 0
풀스크린 버튼을 재생바에 표시합니다. 옵션값을 0으로 줄 경우 재생바에 전체화면 버튼이 사라집니다.
version2 에서는 Fullscreen 버튼이 기본적으로 제공되지 않으므로 &fs=1 을 넣어주면 재생바에 Fullscreen 버튼이 생깁니다.
예시 : version=3&rel=0&autoplay=1" → version=2&rel=0&autoplay=1&fs=1"
<!--[if !supportEmptyParas]--> <!--[endif]-->
&iv_load_policy (이 환경에서 지원됨 : AS3,AS2,HTML5)
• 기본값 : 1
• 옵션값 : 3
동영상 진행되는도중 화면에 영상주석들이 주렁주렁 보이는게 싫다면 옵션값 3으로 설정하세요.
기본값은 1로 영상주석들이 보입니다. 하지만 강좌 동영상의 경우 영상의 자체자막이 아닌 유투브 주석을 이용하는 경우도 있으므로 꺼두면 안될때도 있긴하죠.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&loop=0 (이 환경에서 지원됨 : AS3,HTML5)
• 기본값 : 0
• 옵션값 : 사용자가 원하는 숫자
동영상이 끝난 후 지정된 횟수만큼 반복되게 합니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&rel=1(이 환경에서 지원됨 : AS3,HTML5)
• 기본값 : 1
• 옵션값 : 0
동영상이 끝난 후 관련 동영상(related videos) 목록들이 뜨게 할지 안할지 지정합니다.
기본적으로는 뜨게 되지만 0으로 지정할 시 안뜨게 됩니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&showinfo=1(이 환경에서 지원됨 : AS3,AS2,HTML5)
• 기본값 : 1
• 옵션값 : 0
동영상이 시작되기전에 동영상의 제목이나 업로더 이름등이 노출되지 않도록 합니다.
기본값은 1로 노출이 되지만 0으로 설정할 시 단순히 동영상 썸네일만 보이며 정보는 노출되지 않습니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&theme=dark(이 환경에서 지원됨 : AS3,AS2,HTML5)
• 기본값 : dark
• 옵션값 : light
유튜브 동영상의 테마색상을 지정합니다.
아직은 JW플레이어처럼 다양한 스킨들을 지원하지는 않고 단순히 색깔만 바꾸는 정도입니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
&ps=blogger (이 환경에서 지원됨 : AS3,AS2,HTML5)
이 옵션을 사용하면 재생바에 유튜브 링크 버튼을 없애버립니다.
원래 이 버튼을 누르면 해당 동영상을 유튜브 사이트에서 볼 수 있고 영상의 출처도 쉽게 찾을 수 있지만 만일 이 옵션을 사용하게 되면 유튜브로 보기 버튼이 사라져버리기 때문에 쉽게 영상의 출처를 찾을 수 없고 반드시 "소스보기" 메뉴를 통해 추적해야 합니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
<!--[if !supportEmptyParas]--> <!--[endif]-->
&modestbranding=1 (이 환경에서 지원됨 : AS3,AS2,HTML5)
바로 위 &ps=blogger와 완벽하게 똑같은 옵션입니다. 만일 위 옵션이 먹히지 않는다면 이 옵션을 사용해보세요!
이 옵션과 color 문장과는 서로 호환이 안되기 때문에 같이 사용하게 되면 이 옵션이 작동하지 않습니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
width="300" height="25"
플레이어의 가로,세로 크기를 지정할 수 있습니다.
이 옵션은 앞에 "&"가 붙지 않습니다. 최종적으로 &옵션을 지정한다음에 한칸띄고 작성해주시면 됩니다.
참고로 가로300,세로25의 크기를 지정하면 영상이 보이지 않는 음악플레이어를 만들 수 있게 됩니다.
<!--[if !supportEmptyParas]--> <!--[endif]-->
<이상 옮겨 온 글>.
'옮겨온 글' 카테고리의 다른 글
쉬운듯 어려운 계산법, (0) | 2019.06.11 |
---|---|
유튜브 추가적인 팁 (0) | 2018.10.28 |
html 유튜브 동영상 반복재생 및 자동재생 넣는 법 (1) | 2018.10.28 |
유튜브 자동,반복,연속재생 태그 활용방법 (4) | 2016.03.09 |