2011-05-03 195 views
1

我想屏蔽HTML5視頻元素並將其轉換爲三角形。我想要一個可以在IE9,Firefox和Chrome上運行的解決方案。可能嗎?屏蔽HTML5視頻

回答

1

您可以在Firefox中使用SVG遮罩視頻,但這不適用於IE9或Chrome。您可以將視頻逐幀複製到畫布元素,然後在那裏操作視頻以創建遮罩效果。據我所知,只使用CSS雖然不可能。

+0

如何逐幀複製視頻? – 2011-05-03 18:16:54

+0

去年我在博客上做過類似的事情:http://blogs.msdn.com/b/thebeebs/archive/2010/11/08/how-to-rotate-html5-video.aspx – 2011-05-03 18:19:40

+1

謝謝,還發現了一個很好的文章在這裏https://developer.mozilla.org/En/Manipulating_video_using_canvas理想情況下,雖然我想這樣做,而不使用畫布。 – 2011-05-03 18:27:41

2

我不知道這是如何跨瀏覽器兼容,但我知道蘋果有一個Safari Technology Demo他們在HTML5視頻上使用-webkit-mask。這可能是值得調查的。

+0

由於它是一個Safari演示程序,它可以在基於webkit的引擎上工作(例如Google Chrome)。儘管IE9在沒有反饋的情況下失敗了,但Firefox會輕聲建議它不能播放該演示。 – 2012-03-08 16:28:08