Ответ 1
<div id="video-player">
<video src="http://movies.apple.com/media/us/html5/showcase/2011/demos/apple-html5-demo-tron-us_848x352.m4v"></video>
<p><a href="javascript:playPause();">Play/Pause</a></p>
</div>
<script type="text/javascript">
// intercept and cancel requests for the context menu
var myVideo = document.querySelector('video');
myVideo.addEventListener("contextmenu", function (e) { e.preventDefault(); e.stopPropagation(); }, false);
// hide the controls if they're visible
if (myVideo.hasAttribute("controls")) {
myVideo.removeAttribute("controls")
}
// play/pause functionality
function playPause() {
if (myVideo.paused)
myVideo.play();
else
myVideo.pause();
}
// essentially you'll have to build your own controls ui
// for position, audio, etc.
</script>
Идея состоит в следующем:
- Предотвратите доступ пользователя к контекстному меню (чтобы показать элементы управления)
- Скрыть любые элементы управления, которые могут быть видны
Недостатком является то, что вы должны реализовать свой собственный интерфейс пользователя, но это не слишком сложно.
* Этот код предназначен только для того, чтобы показать вам, как решить проблему, а не для использования в реальном приложении
Немного больше исследований по теме:
webkit-playinginline Указывает, что элемент видео должен воспроизводиться в режиме онлайн вместо полноэкранного.
Связанные теги "video" Доступность Доступна в iOS 4.0 и более поздних версиях. (Включено только в UIWebView с разрешениемInlineMediaPlayback свойство установлено в YES. источник
Я боюсь, что это не будет возможно с помощью видеоплеера в Safari
У них есть руководство для видео на холсте, но, как вы, вероятно, знаете, оно еще не поддерживается в IOS: видео на холсте
В этом документе кратко изложены текущие ограничения на мобильный контент в IOS: статус мобильного видео