ȸ¿ø°¡ÀԡžÆÀ̵ð/ºñ¹øÃ£±â
ȨÀ¸·Î


HTML <Audio> »ç¿ë¹ý
3³â Àü
ÀÚ¹Ù½ºÅ©¸³Æ® »ó¿¡¼­ Audio °´Ã¼¸¦ »ý¼ºÇÏ¿© Àç»ý/ÀϽà Á¤Áö µîÀ» ÄÁÆ®·ÑÇÒ ¼ö ÀÖ´Ù.
´Ü, Å©·Òºê¶ó¿ìÀúÀÇ °æ¿ì »ç¿ëÀÚÀÇ ¸í½ÃÀûÀÎ ¾×¼Ç(Ŭ¸¯ µî)ÀÌ ¾ø´Â »óÅ¿¡¼­ÀÇ À½¿ø Àç»ýÀº ÀÛµ¿ÇÏÁö ¾Ê´Â´Ù.

°´Ã¼ »ý¼º
var audio = new Audio('audio_file.mp3');
audio.play();

¸¸¾à HTML »ó¿¡ audioű׸¦ ¼±¾ðÇØµÐ »óŶó¸é, ¿¤¸®¸ÕÆ® Ãëµæ ¹æ½ÄÀ¸·Î audio°´Ã¼¸¦ È®º¸ÇÒ ¼ö ÀÖ´Ù.

<!-- HTML audio ÅÂ±× -->
<audio src="sound.mp3" id="myAudio"></audio>

/* Javascrip ÄÚµå */
const myAudio = document.getElementById("myAudio") // Audio°´Ã¼ Ãëµæ
myAudio.play(); // À½¿ø Àç»ý
myAudio.pause(); // ÀϽà Á¤Áö

Audio °´Ã¼ ¸Þ¼­µå

play() Àç»ý
pause() ÀϽÃÁ¤Áö
addTextTrack() »õ·Î¿î Æ®·¢À» Ãß°¡
canPlayType() ºê¶ó¿ìÀú°¡ ÇØ´ç ¿Àµð¿À ŸÀÔÀ» Àç»ýÇÒ ¼ö ÀÖ´ÂÁö üũ
load() ¿Àµð¿À °´Ã¼¸¦ ¸®·Îµå

Audio °´Ã¼ ÇÁ·ÎÆÛƼ

src À½¿øÆÄÀÏ °æ·Î : "°æ·Î/ÆÄÀϸí.È®ÀåÀÚ"
volume º¼·ý : 0~1
loop ¹Ýº¹ ¿©ºÎ: true | false
autoplay ÀÚµ¿Àç»ý ¿©ºÎ: true | false
muted À½¼Ò°Å ¿©ºÎ: true | false
paused ÀϽÃÁ¤Áö ¿©ºÎ: true | false
ended Àç»ý¿Ï·á ¿©ºÎ: true | false
duration À½¿øÀÇ Àüü ±æÀÌ(ÃÊ ´ÜÀ§)
currentTime À½¿øÀÇ ÇöÀç Àç»ý À§Ä¡(ÃÊ ´ÜÀ§)
/* ¿Àµð¿À óÀ½ºÎÅÍ Àç»ý */
audio.currentTime = 0; // Àç»ý À§Ä¡¸¦ óÀ½À¸·Î ¼³Á¤
audio.play(); // óÀ½ºÎÅÍ ´Ù½Ã Àç»ýµÊ

Audio °´Ã¼ À̺¥Æ®

canplaythrough À½¿ø ÆÄÀÏÀÌ ¸ðµå ·ÎµåµÇ¾î Àç»ý °¡´ÉÇÒ ¶§
play Àç»ýÀÌ ½ÃÀÛµÉ ¶§
playing Àç»ý ÁßÀÏ ¶§
puase ÀϽà Á¤ÁöµÇ¾úÀ» ¶§
ended Àç»ýÀÌ ¿Ï·áµÇ¾úÀ» ¶§
volumechange º¼·ýÀÌ º¯°æµÉ ¶§

»ùÇà ÄÚµå
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Audio °´Ã¼</title>
</head>
<body>
<button class="btn1">play sound1</button>
<button class="btn2">play sound2</button>
<script src="index.js"></script>
</body>
</html>

// btn1À» ´­·¶À» ¶§ sound1.mp3 Àç»ý
document.querySelector(".btn1").addEventListener("click", function () {
var audio1 = new Audio("sound1.mp3");
audio1.loop = false; // ¹Ýº¹Àç»ýÇÏÁö ¾ÊÀ½
audio1.volume = 0.5; // À½·® ¼³Á¤
audio1.play(); // sound1.mp3 Àç»ý
});

// btn2¸¦ ´­·¶À» ¶§ sound2.mp3 Àç»ý
document.querySelector(".btn2").addEventListener("click", function () {
var audio2 = new Audio("sound2.mp3");
audio2.loop = true; // ¹Ýº¹Àç»ýÇÏÁö ¾ÊÀ½
audio2.volume = 0.5; // À½·® ¼³Á¤
audio2.play(); // sound2.mp3 Àç»ý
setTimeout(function () { // 1ÃÊ ÈÄ sound2.mp3 ÀϽÃÁ¤Áö
audio2.pause();
}, 1000);
});
ÃßõÃßõ : 240 Ãßõ ¸ñ·Ï
¹øÈ£ Á¦¸ñ
2,891
ÀÔ·Â Çʵ忡¼­ ƯÁ¤´Ü¾î(¿¹:#err)°¡ Æ÷ÇԵǾúÀ» ¶§ ½Ç½Ã°£ °¨Áö ¹× °æ°íâ ¶ç¿ì±â
2,890
µ¥ÀÌÅͺ£À̽º ÃÖÀûÈ­¿Í Äõ¸® È¿À²¼ºÀ» ³ôÀÌ °Ë»ö ¼º´ÉÀ» °³¼±ÇÏ´Â ¹æ¹ý
2,889
°£´ÜÇÑ °Ô½ÃÆÇ ¸¸µé±â
2,888
PHPÀÇ php.ini ÆÄÀÏ¿¡¼­ ¼³Á¤ÇÒ ¼ö ÀÖ´Â ÁÖ¿ä Ç׸ñµéÀ» Ä«Å×°í¸®º°·Î Á¤¸®
2,887
À¯Æ©ºê µ¿¿µ»óÀÇ ½æ³×ÀÏ À̹ÌÁö¸¦ üũÇÏ¿© À¯È¿ÇÑ ¿µ»óÀ̾ƴҶ§ ¿¬°áµÈ üũ¹Ú½º¸¦ ÀÚµ¿À¸·Î üũ
2,886
À̹ÌÁö URLÀÌ À¯È¿ÇÏÁö ¾ÊÀ» ¶§, ÇØ´ç À̹ÌÁö¿Í ¿¬°áµÈ üũ¹Ú½º¸¦ ÀÚµ¿À¸·Î üũ
2,885
HTTPS·Î Á¢¼ÓÇÑ »ç¿ëÀÚ¸¦ °­Á¦·Î HTTP·Î ¸®µð·º¼Ç ÇÏ·Á¸é
2,884
PHP¿¡¼­ MP3 ÆÄÀÏÀ» Á÷Á¢ ÀÐ°í ½ºÆ®¸®¹Ö Çϱâ
2,883
ÇöÀç ÆäÀÌÁö°¡ location.reload()¿¡ ÀÇÇØ »õ·Î°íħµÇ¾ú´ÂÁö
2,882
ÅØ½ºÆ® ÆÄÀÏÀ» Àаí, °¢ ÁÙÀÇ ³¡¿¡¼­ 6±ÛÀÚ¸¦ »èÁ¦ÇÑ ÈÄ, °á°ú¸¦ »õ·Î¿î ÆÄÀÏ¿¡ ÀúÀåÇÕ´Ï´Ù.
2,881
cURLÀ» »ç¿ëÇÏ¿© ¸®´ÙÀÌ·ºÆ®¸¦ µû¶ó°¡ ÃÖÁ¾ URL °¡Á®¿À±â
2,880
[PHP] $_SERVER ȯ°æº¯¼ö
2,879
10Áø¼ö <-> 16Áø¼ö º¯È¯±â PHP¼Ò½º
2,878
ÅØ½ºÆ®¿¡ Á÷Á¢ ±×¶óµ¥ÀÌ¼Ç »ö»óÀ» Àû¿ëÇÏ·Á¸é?
2,877
CSS¸¦ »ç¿ëÇÏ¿© ¿ä¼ÒÀÇ ³»¿ë¹°¿¡ µû¶ó width¸¦ Á¶Á¤ÇÏ´Â ¹æ¹ý
2,876
À¥¼­¹ö ip È®ÀÎ
2,875
À¥È£½ºÆÃÀÇ Àý´ë°æ·Î¸¦ È®ÀÎ
2,874
input ÀÔ·Â ÇÊµå ¾ÕµÚ °ø¹é ½Ç½Ã°£ Á¦°Å
2,873
Placeholder Æ÷Ä¿½º½Ã °¨Ãß±â
2,872
MySQL Áߺ¹µÈ µ¥ÀÌÅ͸¦ »èÁ¦
2,871
MySQL Áߺ¹ µ¥ÀÌÅÍ È®ÀÎ
2,870
sessionStorage.getItem ¿Í sessionStorage.setItem
2,869
Á¦ÀÌÄõ¸® ·£´ýÀ¸·Î ¹è°æ»ö º¯°æ
2,868
preg match¿¡ °üÇÑ Á¤±Ô½Ä
2,867
Stream an audio file with MediaPlayer ¿Àµð¿À ÆÄÀÏ ½ºÆ®¸®¹Ö Çϱâ
2,866
Audio Streaming PHP Code
2,865
PHP $ SERVER ȯ°æ º¯¼ö Á¤¸®
2,864
Vimeo (ºñ¸Þ¿À) API ¸¦ »ç¿ëÇÏ¿© Ç÷¹À̾î ÄÁÆ®·ÑÇϱâ
2,863
iframe »ç¿ë½Ã ÇÏ´Ü¿¡ ¹ß»ýÇÏ´Â °ø¹é Á¦°Å¹æ¹ý
2,862
¾ÆÀÌÇÁ·¹ÀÓ(iframe) Àüüȭ¸é °¡´ÉÇÏ°Ô Çϱâ
¸ñ·Ï
¹ÂÁ÷Æ®·ÎÆ® ºÎ»ê±¤¿ª½Ã ºÎ»êÁø±¸ °¡¾ßµ¿ ¤Ó °³ÀÎÁ¤º¸Ãë±Þ¹æÄ§
Copyright ¨Ï musictrot All rights reserved.