Браузер Safari перескакивает, чтобы отображать видео в режиме автовоспроизведения HTML5

У меня есть фид содержимого Instagram, который содержит последние сообщения. Если сообщение является видео, оно отображается как таковое: видео HTML5 с автозапуском, петлями и приглушенными атрибутами.Браузер Safari перескакивает, чтобы отображать видео в режиме автовоспроизведения HTML5

Эстетически результат очень приятный; однако в Safari, когда видео завершило загрузку, браузеры пропускают веб-страницу до положения видео. В Chrome это не делается.

Видео не является основным содержанием, поэтому я не хочу, чтобы он пропускал страницу.

Вопросы

Есть стандарт W3C для автозапуска? i.e является сафари или хромом, использующим подход по умолчанию
Каков наилучший способ исправить это?

Мысли о soultion

я мог отключить автозапуск и вместо того, чтобы вызвать игру с JS. Это, однако, кажется немного ненужным и создает новую зависимость.

источник

2016-12-22 slawrence10

W3C, кажется, не сказать, если автозапуск видео автоматически прокручивать, чтобы сосредоточиться, так что не подумайте, что есть правильное или неправильное. Мое предпочтение было бы отключить автовоспроизведение и щелкнуть пользователем, чтобы инициировать любое видео - означает, что пользователь всегда видит видео с самого начала и контролирует использование полосы пропускания. – Offbeatmammal

Спасибо @Offbeatmammal. Я знаю о последствиях UX. Раздражает то, что сафари, похоже, усиливает это. – slawrence10

Я столкнулся с той же проблемой с веб-сайтом, над которым я работаю. Я попытался удалить атрибут автовоспроизведения и запустить воспроизведение видео после тайм-аута в JS. Однако, как только видео запускается для воспроизведения, Safari возвращается к видео, как раньше. –

* Обновлено: Ограничение длины прокрутки до 1500 единиц до 2 секунд после того, как начинается воспроизведение видео ...

<html> 
<head> 
    <script type="text/javascript"> 
    var scrollPosition = 0; 
    var videoLoaded = false; 
    function bodyOnScroll() { 
    // this 1500 value might need to be tweaked less or more depending 
    // on how far the scroll to your video is 
    if(Math.abs(document.body.scrollTop - scrollPosition) > 1500 && !videoLoaded) 
    { 
    // don't scroll 
    document.body.scrollTop=scrollPosition; 
    } 
    else 
    { 
    // reload the variable to match current position 
    scrollPosition=document.body.scrollTop; 
    } 
    } 
    function videoOnPlaying(){ 
    // wait 2 seconds and then disable the max scrollPosition 
    // might want to tweak this too depending 
    setTimeout(function() { 
     videoLoaded = true; 
    }, 2000); 
    } 
    </script>  
</head> 
<body onScroll="bodyOnScroll();"> 
<video autostart onPlay="videoOnPlaying();"></video>

источник

2017-01-02 19:08:23 pizzaslice

Привет, @pizzaslice спасибо за ваш вклад. Поймите последствия UX. К сожалению, ваше решение в настоящее время делает то же самое, что и моя проблема ... он перескакивает пользователя где-то на странице при загрузке видео. – slawrence10

Браузер Safari перескакивает, чтобы отображать видео в режиме автовоспроизведения HTML5

ответ

Смежные вопросы