브라우저에서 오디오를 루프하는 가장 좋은 방법은 무엇입니까?

많은 멀티 트랙 오디오 루프가 포함 된 사이트를 만들고 있습니다. (자바 스크립트 등으로) 이것을 구현하는 가장 좋은 방법이 궁금합니다.브라우저에서 오디오를 루프하는 가장 좋은 방법은 무엇입니까?

사용해야합니까 : 때 플래시 또는 일부 관련 플래시 라이브러리

또는

-html5 오디오

또는 뭔가 다른?

는 오디오 루프가 원활한 것이 매우 중요합니다

이것에 대한 좋은 라이브러리가 무엇입니까? 과거에는 soundmanager를 사용했습니다. 파일은 대부분 mp3입니다. Flash를 사용하여 괜찮다면

출처

2013-03-08 pepper

당신은 웹 오디오 API를 사용할 수 있습니다 ... 후 다시 재생, 전체 이벤트를 수신 오디오를 가져올 수 있습니다

여기에는 시작하기 위해 보일러 플레이트 "추상화 된"코드가 있습니다. 서버가 필요합니다.

<!DOCTYPE html> 
<meta charset="UTF-8"> 
<title></title> 

<div id="kickDrum"> </div> // click and will loop 
<div id="snareDrum"></div> // Won't loop 




<script> 
var kickDrum = new audioApiKey("kickDrum","kick.mp3",true);  // first argument is the div name, the next is the audio file name & url the last parameter is loop on/off. true means loop on 

var snareDrum = new audioApiKey("snareDrum","snare.mp3", false); 





// Below is the abstracted guts. 

var context = new webkitAudioContext(); 

function audioApiKey(domNode,fileDirectory,loopOnOff) { 
    this.domNode = domNode; 
    this.fileDirectory = fileDirectory; 
    this.loopOnOff = loopOnOff;      
    var bufferFunctionName = bufferFunctionName; 
    var incomingBuffer; 
    var savedBuffer; 
    var xhr; 
     bufferFunctionName = function() { 
     var source = context.createBufferSource(); 
     source.buffer = savedBuffer; 
     source.loop = loopOnOff; 
     source.connect(context.destination); 
     source.noteOn(0); // Play sound immediately 
     }; 
    var xhr = new XMLHttpRequest(); 
    xhr.open('get',fileDirectory, true); 
    xhr.responseType = 'arraybuffer'; 
    xhr.onload = function() { 
    context.decodeAudioData(xhr.response, 
     function(incomingBuffer) { 
     savedBuffer = incomingBuffer; 
     var note = document.getElementById(domNode); 
     note.addEventListener("click", bufferFunctionName , false); 
     } 
    ); 
    }; 
xhr.send(); 
}; 

</script>

이 환상적이다, 그러나 그것은 단지 크롬에서 작동합니까

<style> 

#kickDrum { 
    background-color:orange; 
    position:absolute; 
    top:25%; 
    left:25%; 
    width: 200px; 
    height:200px; 
    border-radius:120px; 
    border-style:solid; 
    border-width:15px; 
    border-color:grey; 
} 

#snareDrum { 
    background-color:orange; 
    position:absolute; 
    top:25%; 
    left:50%;  
    width: 200px; 
    height:200px; 
    border-radius:120px; 
    border-style:solid; 
    border-width:15px; 
    border-color:grey; 
} 

</style>

출처

2013-03-13 04:34:22 William

CSS? 웬일인지 그게 유일한 곳이라면 무엇이라도 듣고 있습니다 – pepper

그것은 사파리의 최신 버전에서 작동합니다. Safari 6 이상 – William

것은, 당신은 당신이 내용이 있다면

import flash.events.Event; 
import flash.media.Sound; 
import flash.net.URLRequest; 

var snd:Sound = new Sound(); 
var req:URLRequest = new URLRequest("smallSound.mp3"); 
snd.load(req); 

var channel:SoundChannel = snd.play(); 
channel.addEventListener(Event.SOUND_COMPLETE, onPlaybackComplete); 

public function onPlaybackComplete(event:Event) 
{ 
    trace("The sound has finished playing."); 
    snd.play(); 
}

출처

2013-03-08 14:56:14 whodeee

브라우저에서 오디오를 루프하는 가장 좋은 방법은 무엇입니까?

답변

관련 문제