"HTML5 오디오 자동재생"의 두 판 사이의 차이

(새 문서: ;HTML5 audio 배경음악 재생 ==소스코드== <source lang='html5'> <!DOCTYPE html> <meta charset="utf-8" /> <script> var bgm = new Audio(''); if(bgm.canPlayType('audio/ogg')) bg...)
 
잔글 (봇: 자동으로 텍스트 교체 (-</source> +</syntaxhighlight>, -<source +<syntaxhighlight ))
 
(사용자 3명의 중간 판 25개는 보이지 않습니다)
1번째 줄: 1번째 줄:
;HTML5 audio 배경음악 재생
==개요==
;HTML5 audio autoplay
;HTML5 음악 자동재생
;HTML5 audio 배경음악 자동재생
;음악 재생 html
*웹페이지가 열리면 바로 음악을 재생
*PC에서는 잘 됨. IE8, 크롬.
*스마트폰에서는 잘 안됨. 브라우저에 따라 autoplay가 제한되어 있음.


==소스코드==
==소스코드==
<source lang='html5'>
<syntaxhighlight lang='html5'>
<!DOCTYPE html>
<!DOCTYPE html>
<meta charset="utf-8" />
<meta charset="utf-8" />
<script>
<script>
var bgm = new Audio('');
var bgm = new Audio('');
if(bgm.canPlayType('audio/ogg')) bgm = new Audio('/sounds/main.ogg');
if(!bgm.canPlayType('audio/ogg')) alert('브라우저가 ogg 재생을 지원하지 않습니다.');
else if(bgm.canPlayType('audio/mp3')) bgm = new Audio('/sounds/main.mp3');
else {
bgm.play();
var bgm_url = 'http://upload.wikimedia.org/wikipedia/commons/d/d7/Wikinews_Remix_Jingle.ogg';
bgm = new Audio(bgm_url);
bgm.play();
}
</script>
</script>
</source>
<body>
*예제: http://jmnote.com/html5/audio_bgm.php
<h1>음악 재생중</h1>
</body>
</syntaxhighlight>
*예제: http://example.zetawiki.com/html5/audio_bgm.php


[[분류: HTML5]]
==같이 보기==
[[분류: 음악]]
*[[HTML5 음악 볼륨 조절]]
*[[HTML5 음악 반복 재생]]
*[[HTML5 음악 재생기]]
 
[[분류:HTML5]]
[[분류:JavaScript]]
[[분류:Audio]]

2020년 11월 2일 (월) 02:51 기준 최신판

1 개요[ | ]

HTML5 audio autoplay
HTML5 음악 자동재생
HTML5 audio 배경음악 자동재생
음악 재생 html
  • 웹페이지가 열리면 바로 음악을 재생
  • PC에서는 잘 됨. IE8, 크롬.
  • 스마트폰에서는 잘 안됨. 브라우저에 따라 autoplay가 제한되어 있음.

2 소스코드[ | ]

<!DOCTYPE html>
<meta charset="utf-8" />
<script>
var bgm = new Audio('');
if(!bgm.canPlayType('audio/ogg')) alert('브라우저가 ogg 재생을 지원하지 않습니다.');
else {
	var bgm_url = 'http://upload.wikimedia.org/wikipedia/commons/d/d7/Wikinews_Remix_Jingle.ogg';
	bgm = new Audio(bgm_url);
	bgm.play();
}
</script>
<body>
<h1>음악 재생중</h1>
</body>

3 같이 보기[ | ]

문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}