Safari HTML 5 видео тег не работает внутри тега ссылки

Question

Проблема с Safari.Видео тег.Я поместил тег видео в тег ссылки.Я пытаюсь сделать ссылку на видео.Работает во всех браузерах, кроме Safari.рассматриваемая страница находится здесь: neumatic.com В Safari он идет только к изображению постера, но не воспроизводит видео.Я попытался переместить тег ссылки вверх по дереву div, не повезло.

Answer 1

Не похоже, что элемент <video> допускается даже в элементе <a>.В соответствии с спецификациями HTML :

Элемент a может быть обернут вокруг целых абзацев, списков, таблиц и т. Д., Даже целых разделов, при условии, что существует нет интерактивного контента в (например, кнопки или другие ссылки).

Несмотря на то, что валидатор HTML5 говорит, что видео внутри якоря является действительным (на данный момент), я бы рассмотрелвидео является интерактивным контентом, но я не могу найти ничего, что конкретно перечисляет, какой элемент в HTML5 считается "интерактивным контентом".

Если он действителен: Похоже, это просто проблема совместимости браузера.Ранее контент уровня блока (который включал бы элемент видео) был , а не , разрешенный внутри якорей.В настоящее время в Safari могут быть только ошибки или проблемы с реализацией, относящиеся к контенту на уровне блоков, которые могут быть даже специфичными для элемента видео.Вы должны помнить, что HTML5 все еще нов и находится в стадии разработки, вы обязательно столкнетесь с какими-то странными проблемами и проблемами.Попробуйте отправить отчет об ошибке в Safari.

В любом случае, я считаю, что размещение видео внутри якоря - плохая практика, по моему личному мнению.Удачи.

Answer 2

Я получил простое видео для работы в Safari 5.1.1 в OS X и обнаружил, что атрибут poster в <video> препятствует его работе в Safari, а не <a>, обернутый вокруг него. Если вы удалите атрибут poster, он отлично работает в Safari. Я сохранил ваш код точно таким же, за исключением удаления атрибута poster (за исключением меньшего width и полной квалификации src, чтобы он воспроизводился, что не повлияло на результат).

Другое видео

Демо: http://jsfiddle.net/ThinkingStiff/8vTN7/

<a href="http://thinkingstiff.com" target="_top">
<video controls="controls" width="592" height="252">
<source src="http://html5videoformatconverter.com/data/images/happyfit2.mp4">
</video>
</a>

Ваше видео

Демо: http://jsfiddle.net/ThinkingStiff/cRx4a/

Изменено:

<video class="video-js" autoplay="" loop="" preload="" poster="_neumatic-video/neumatic-video-production-intro/neumatic-video-production_poster.jpg" id="intro">

Кому:

<video class="video-js" autoplay="" loop="" preload="" id="intro" >