2016-08-18 5 views
0

Reveal.jsでスライドショーを作成しています。ドキュメント(https://github.com/hakimel/reveal.js/)によれば、遅延読み込みにはデータ -を使用することになっています。遅延ロードを利用してJSでオーディオを再生するにはどうすればよいですか?レイジーロードとJavascript with Reveal.js

これは私が試したものですが、それはオーディオを再生しませんでした:

<section> 
    <audio id="audio2" controls><source data-src="http://opengameart.org/sites/default/files/foom_0.wav" type="audio/wav"></audio> 
    <script> 
     var x = document.getElementById("audio2"); 
     x.play(); 
    </script> 
</section> 

答えて

1

あなたのスクリプトは、おそらく遅延ロードがまだ起きていない、その時点でのプレゼンテーションがロードされる時、で実行され、ファイルは再生できません。

あなたはスライドが表示されたときに自動的にオーディオファイルを再生したい場合は、あなたがevent emitted by Reveal upon showing the slideのコールバックであなたのx.play()を実行する必要があります。

Reveal.addEventListener('slidechanged', function(event) { 
    if (event.indexh === mySlideNumberWithAudio) { // might need to check indexv too 
     document.getElementById("audio2").play(); 
    } 
});