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

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>

예제: http://example.zetawiki.com/html5/audio_bgm.php

3 같이 보기[ | ]

@@ 9번째 줄: / 9번째 줄: @@
 ==소스코드==
-<source lang='html5'>
+<syntaxhighlight lang='html5'>
 <!DOCTYPE html>
 <meta charset="utf-8" />
@@ 16번째 줄: / 16번째 줄: @@
 if(!bgm.canPlayType('audio/ogg')) alert('브라우저가 ogg 재생을 지원하지 않습니다.');
 else {
-	var bgm_url = 'https://www.youtube.com/watch?v=tzUWelysHvU';
+	var bgm_url = 'http://upload.wikimedia.org/wikipedia/commons/d/d7/Wikinews_Remix_Jingle.ogg';
 	bgm = new Audio(bgm_url);
 	bgm.play();
@@ 24번째 줄: / 24번째 줄: @@
 <h1>음악 재생중</h1>
 </body>
-</source>
+</syntaxhighlight>
-*예제: http://zetawiki.com/ex/html5/audio_bgm.php
+*예제: http://example.zetawiki.com/html5/audio_bgm.php
 ==같이 보기==