我创建了一个包含8个音轨的网页,每个音轨都使用自己的音频和源标签:
HTML
<ul>
<li> Sleepwalk <br><audio controls> <source src="sleepwalk.mp3" type="audio/mpeg" /> </audio></li>
<li>Sunny <br><audio controls> <source src="sunny.mp3" type="audio/mpeg" /> </audio></li>
<li>Georgia on My Mind<br>
<audio controls> <source src="georgia.mp3" type="audio/mpeg" /> </audio></li>
<li>All of Me <br><audio controls> <source src="allofme.mp3" type="audio/mpeg" /> </audio></li>
<li>The Shadow of Your Smile<br>
<audio controls> <source src="shadow.mp3" type="audio/mpeg" /> </audio></li>
<li>Mr. Sandman <br><audio controls> <source src="sandman.mp3" type="audio/mpeg" /> </audio></li>
<li>Chestnuts (The Christmas Song) <br><audio controls> <source src="chestnuts.mp3" type="audio/mpeg" /> </audio></li>
<li>White Christmas <br><audio controls> <source src="white.mp3" type="audio/mpeg" /> </audio></li>
</ul>
在我的显示器上,这可以正常工作(http://mikeytheking.com/guitarmusic.html),但在我的Android上,我看到每个控件的左半部分,但点击什么也没做。
请告知。
答案 0 :(得分:0)
使用此.. ..
<script type=text/javascript>
var maudio = document.getElementById('myaudio');
var soundSprite = [{
start: 0,
end: 3000
},
{
start: 3500,
end: 6789
}
];
element.addEventListener('touchstart', function(ev) {
maudio.play();
playSoundFile(0);
})
function playSoundFile(idx) {
maudio.currentPosition = soundSprite[idx].start;
var x = setInterval(function() {
if (maudio.currentPosition >= soundSprite[idx].end) {
maudio.pause(); // There is no stop() in HTML5
clearInterval(x);
}
}, 50);
}
</script>
<audio src="sprite.mp3" controls="none" id="myaudio" />