티스토리 뷰
728x90
반응형
아래 코드는 youtube api 에서 공식적으로 제공하는 코드 이다.
https://developers.google.com/youtube/iframe_api_reference?hl=ko
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var youtubePlayer;
function onYouTubeIframeAPIReady() {
youtubePlayer = new YT.Player('player', {
width: '640',
height: '360',
videoId: 'x993sfGToV0',
playerVars:{
rel:0 //관련영상 표시하지 않기.
},
events: {
'onReady': onPlayerReady, //로딩할때 이벤트 실행
'onStateChange': onPlayerStateChange //플레이어 상태 변화시 이벤트실행
}
});
}
function onPlayerReady(event) {
event.target.playVideo();//자동재생
}
var done = false;
function onPlayerStateChange(event) {
if (event.data === YT.PlayerState.PLAYING && !done) {
// setTimeout(stopVideo, 6000);
done = true;
}
}
function stopVideo() {
youtubePlayer.stopVideo();
}
function playVideo() {
youtubePlayer.playVideo();//재생
}
728x90
반응형
'Programming language > javascript' 카테고리의 다른 글
[gulp ts] gulp 를 통한 typescript 변환 (0) | 2021.01.08 |
---|---|
jQuery 에서 Pure Javascript 로 전환하기. (0) | 2021.01.07 |
git master브랜치 복사 새로운 브랜치로 복제 (0) | 2019.09.17 |
git 줄바꿈 문자 문제~ If you choose Fix and Commit, git config --global core.autocrlf input will be executed. 어쩌구~ (0) | 2019.08.27 |
자바스크립트 paging 처리 (1) | 2019.08.09 |
댓글
250x250
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 앵귤러
- svg모션
- IntrinsicElements
- svg icon font
- 코도바
- Vue3
- React.StrictMode
- 반복문
- 태그
- git checkout -b
- JsDoc
- 내장요소
- for of 구문
- cordova
- icon font
- Angular
- Intrinsic
- RefreshToken
- interceptors
- git
- react
- react-router-dom
- 아이콘 폰트 만들기
- Aptana
- anime.js
- 자바스크립트
- svg 폰트
- CSS
- vue-router
- 리프래시토큰
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
글 보관함