Хотелось бы сказать вам, что есть волшебная формула, чтобы все ваши html5-медиа работали безупречно, но это не так.Мобильная поддержка аудио / видео в формате HTML5 сейчас довольно слабая;намного дальше, чем его настольные предшественники.Что еще хуже, каждая из разных платформ обрабатывает ее по-разному, и большинство из них поддерживают ее только в последних версиях.
Однако есть некоторые приемы, которые можно использовать, чтобы заставить медиафайлы корректно работать на мобильных устройствах.Сафари.Чтобы объяснить их, вам нужно понять некоторые из его недостатков.
1) Вы не можете загрузить несколько аудио / видео файлов
По моему опыту,браузер будет загружать только один файл за раз.Если вы проигрываете один файл, переходите к другому, а затем возвращаетесь, и он просто загружает этот файл снова и снова.И хотя я сам не пробовал, я не верю, что манифест кеша поможет вам здесь.
Мне нужно было объединить все мои аудиофайлы в один большой аудиофайл.Затем, в зависимости от того, какая звуковая дорожка была запрошена, я бы переместил позицию воспроизведения в соответствующую начальную позицию и воспроизвел эту дорожку.Затем я бы использовал setInterval для проверки воспроизведения каждые несколько миллисекунд, чтобы определить, достигло ли текущая позиция воспроизведения конца дорожки.Как только это произошло, я остановился.Плюс, я давал себе несколько секунд (2-3) между каждой дорожкой, на случай, если процессор телефона был сильно загружен, и проверил подачу немного слишком поздно.
2) Вы не можетеавтоматическое воспроизведение аудио / видео файлов
Apple встроила в свою технологию тегов мультимедиа HTML5 ограничение, заключающееся в том, что эти дорожки будут загружаться и воспроизводиться только в ответ на событие щелчка пользователя.Таким образом, разработчики не могли автоматически воспроизводить надоедливые треки, когда вы заходили на их сайты.
Когда я использовал аудио / видео теги, я пытался создать мультимедийную рекламу.Поэтому я подключил загрузку аудио / треков к событию клика по баннеру, когда вы кликаете по баннеру и раскрываете рекламу.
То, что я бы посоветовал вам сделать, - это всплывающее маленькое всплывающее окно, спрашивающее пользователя, хотят ли они включить / выключить звук.Вы можете прикрепить свои функции загрузки к событию click этого всплывающего окна, независимо от того, включает ли пользователь звук или выключает его.
Лично мне не очень повезло с использованием функции load ().Я бы запустил эту функцию, чтобы загрузить аудио, а затем щелкнуть кнопку воспроизведения, и он просто загрузит его снова.Могло случиться так, что я просто не сделал это правильно, поэтому не стесняйтесь доказать, что я не прав, и заставить это работать.Что я сделал, так это сказал треку проиграть, чтобы он начал загружаться, а затем я использовал setInterval, чтобы посмотреть, увеличилось ли текущее время воспроизведения всего на несколько миллисекунд.Как только я заметил, что он начал воспроизводить трек, я сразу же приостановил его.
3) Тэги аудио / видео поддерживаются только в iOS 4.0 и более поздних версиях
Там нет хитрости, чтобы обойтиэтот.Это просто факты.
Вот несколько сайтов, которые помогли мне, когда я разрабатывал аудио / видео теги:
http://www.w3.org/wiki/HTML/Elements/video
http://dev.w3.org/html5/spec-author-view/video.html#media-elements
Удачи!