[英]HTML5 video player behavior on iPhone and iPod in Safari Web Apps
[英]HTML5 Audio player works on safari/Chrome, but not iPhone
我有一個HTML5音頻播放器可以在PC上運行Safari,但似乎不適用於(我的)iPhone(4)。 這是代碼:
`
function loadPlayer() {
var audioPlayer = new Audio();
audioPlayer.controls="controls";
audioPlayer.addEventListener('ended',nextSong,false);
audioPlayer.addEventListener('error',errorFallback,true);
document.getElementById("player").appendChild(audioPlayer);
nextSong();
}
function nextSong() {
if(urls[next]!=undefined) {
var audioPlayer = document.getElementsByTagName('audio')[0];
if(audioPlayer!=undefined) {
audioPlayer.src=urls[next];
audioPlayer.load();
audioPlayer.play();
next++;
} else {
loadPlayer();
}
} else {
alert('the end!');
}
}
function errorFallback() {
nextSong();
}
function playPause() {
var audioPlayer = document.getElementsByTagName('audio')[0];
if(audioPlayer!=undefined) {
if (audioPlayer.paused) {
audioPlayer.play();
} else {
audioPlayer.pause();
}
} else {
loadPlayer();
}
}
function stop() {
var audioPlayer = document.getElementsByTagName('audio')[0];
audioPlayer.pause();
audioPlayer.currentTime = 0;
}
function pickSong(num) {
next = num;
nextSong();
}
var urls = new Array();
urls[0] = '01_horses_mouth/mp3/01. Let The Dog See The Rabbit preface.mp3';
urls[1] = '01_horses_mouth/mp3/02. The Other Horse\'s Tale.mp3';
urls[2] = '01_horses_mouth/mp3/03. Caged Tango.mp3';
urls[3] = '01_horses_mouth/mp3/04. Crumbs.mp3';
urls[4] = '01_horses_mouth/mp3/05. Mood Elevator Reprise.mp3';
urls[5] = '01_horses_mouth/mp3/06. Mood Elevator.mp3';
urls[6] = '02_dub_project/mp3/01. Fearless Dub.mp3';
urls[7] = '02_dub_project/mp3/02. Original Sound Dub.mp3';
urls[8] = '02_dub_project/mp3/03. Rhok Shok Dub.mp3';
urls[9] = '02_dub_project/mp3/04. Tron Dub.mp3';
urls[10] = '02_dub_project/mp3/05. Eastern Fire Dub.mp3';
urls[11] = '02_dub_project/mp3/06. Mary Jane Dub.mp3';
var next = 0;
`
任何人都可以看到任何明顯的東西會使這在iPhone上不起作用嗎?
還有一個canvas元素的代碼,但我已經將它隱藏在iPhone版本 - 無論如何都是畫布上。 我評論了代碼,但這似乎沒有什么區別,所以我猜這不是沖突。 這是網站:
http://lisadearaujo.com/clientaccess/wot-sound/indexiPad.html
在我的瀏覽器版本中,我隱藏了默認音頻播放器,因此我可以使用自定義控件。 這對於隱藏的div中的玩家來說效果很好。 但是,在iPhone上,div必須顯示才能運行,即使使用自定義控件(或出現)也是如此。
我用低z-index而不是display:none來隱藏div。
iPhone上的HTML5音頻播放器需要點擊用戶。
點擊播放器時工作:
<audio src="foo.ogg" width="200px" height="200px" />
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.