问题在于Safari。视频标签。 我在链接标记中放置了一个视频标记。 我正在尝试制作视频链接。 它适用于除Safari之外的所有浏览器。 有问题的页面在这里:neumatic.com 在Safari中,它只会转到海报图像,但不会播放视频。 我已经尝试将链接标签进一步向上移动到div树上,没有运气。
答案 0 :(得分:1)
在<video>
元素中甚至不允许使用<a>
元素。根据{{3}}:
a元素可以包裹整个段落,列表,表格等,甚至整个部分,只要 中没有交互式内容(例如按钮或其他链接)。< / p>
即使HTML5验证器说锚内的视频是有效的(暂时),我会认为视频是交互式内容,但我找不到任何具体列出HTML5中哪个元素的内容> 被视为“互动内容”。
如果有效:这似乎只是一个浏览器兼容性问题。以前,块级内容(包括视频元素)在锚点中不允许 。 Safari目前可能只是有关于块级内容的错误或实现问题,甚至可能是视频元素特有的。你必须记住HTML5仍然是新的,并且在开发中,你必然遇到一些奇怪的故障和问题。尝试使用Safari提交错误报告。
无论哪种方式,我个人认为,我会考虑将一个视频放在一个锚中作为不好的做法。祝你好运。
答案 1 :(得分:0)
我在OS X上的Safari 5.1.1上为我提供了一个简单的视频,并发现poster
上的<video>
属性阻止它在Safari中工作,而不是{{1缠绕它。如果删除<a>
属性,它在Safari上运行正常。除了删除poster
属性(除了较小的poster
并完全限定width
所以它会起作用之外,我保持您的代码完全相同,但这两者都没有影响结果)。< / p>
演示:http://jsfiddle.net/ThinkingStiff/8vTN7/
src
演示:http://jsfiddle.net/ThinkingStiff/cRx4a/
更改:
<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>
要:
<video class="video-js" autoplay="" loop="" preload="" poster="_neumatic-video/neumatic-video-production-intro/neumatic-video-production_poster.jpg" id="intro">