Скрыть кнопку воспроизведения видео HTML5 на iPhone

Question

Я хочу скрыть большую кнопку воспроизведения, которая появляется по умолчанию на элементе <video>

Возможно ли это?

Answer 1

Вы не можете удалить кнопку воспроизведения. Это видео-заполнитель всегда появляется, когда документ говорит: iPhone Video PlaceHolder . Но, возможно, вы сможете обнаружить, что находитесь на iphone, и отобразить изображение со ссылкой на видео вместо тега видео.

<a href="yourvideo.mp4"><img src="yourposter.png"/></a>

Видео будет запущено в плеере как тег видео.

Answer 2

Да, вы можете сделать это!Хитрость заключается в том, чтобы «скрыть» элементы управления видео, не добавляя атрибут «элементы управления» в тег видео.Затем вы позволяете динамически добавлять его через несколько секунд после начала воспроизведения видео, добавляя свойство «controls» к тегу с помощью Javascript.Просто установите значение «control», и оно будет динамически отображаться в DOM ... как если бы вы добавили элементы управления в HTML-код вашего видео-тега.Настройте таймер по мере необходимости.

<video id="some-video-id" src="some-video-url" poster="some-thumbnail-url" />

<a href="javascript:void(0);" id="startVideoLink">Start the Video</a>

<script type="text/javascript">
    var oVideoTag = document.getElementById('some-video-id');
    var oLink = document.getElementById('startVideoLink');
    if (oLink && oVideoTag) {
        oLink.addEventListener('click',function(e) {
            oVideoTag.play();
            setTimeout(function() {
                oVideoTag.controls = 'controls';
            },2500);
        },false);
    }
</script>