Brightness and contrast in HTML5 video player?
Hello Sir or Madam or Mister or Miss, is it possible to add in future version, "brightness" and "contrast" controls for the built-in HTML5 video player? And maybe also add "RGB" Red / Green / Blue controls ? Thanks if you will add these controls for the built-in HTML5 video player.
All Replies (5)
HI ffilou6, Using SVG a site developer can style the video this way, however it is not a default feature of the HTML5 player. Please also suggest this in input.mozilla.org to leave feedback for the developers.
It may be possible to modify the video using style rules. CSS has a filter property that allows you to reduce brightness and increase/decrease contrast.
- https://developer.mozilla.org/docs/Web/CSS/filter#brightness%28%29
- https://developer.mozilla.org/docs/Web/CSS/filter#contrast%28%29
There also are saturation and hue-rotation filters, but neither is really a straightforward way to adjust RGB levels. I think someone would need to create an add-on to "do the math" for that.
Fun demo page for CSS filters applied to HTML5 video: http://bennettfeely.com/filters/
Click the "gear" icon at the upper right to open up choices so you can switch from the static image to videos. With more than a dozen video tags, it's a little jerky, but if you can overlook that, very interesting.
@jscher2000: Thanks for the CSS information, I didn't know it was possible to do all this!
I'm a beginner in HTML, CSS and PHP coding. I now know it is possible to use CSS filters on pictures. But I don't even know if it is also possible to use CSS filter on a video?
In the demo I linked to, if you right-click a filtered video of the fish tank and Inspect Element (Q), you can see how the filters are applied. Screen shot attached for reference.
