CODEWITHSUNDEEP
htmlcss
Ryan Seacar
Ryan Seacar

Reputation: 55

Mask a HTML5 video

I would like to mask a HTML5 video element and convert it into a triangle. I want a solution that will work in IE9, Firefox and Chrome. Is it possible?

Upvotes: 3

Views: 5727

Answers (2)

user734709
user734709

Reputation:

I'm not sure how cross-browser compatible this is but I know that Apple has a Safari Technology Demo where they use -webkit-mask on an HTML5 video. It might be worth investigating.

Upvotes: 2

Martin Beeby
Martin Beeby

Reputation: 4599

You can mask videos using SVG in Firefox, but that won't work for IE9 or chrome. You could copy the video frame by frame to a canvas element and then manipulate the video there to create a Mask effect. Using just CSS though it is not possible as far as I am aware.

Upvotes: 1

Related Questions