Smartest way to Watermark video.js Player
HTML/CSS solutions should work, if you can add an element at the same level in the DOM hierarchy as the <video>
tag it looks like it will still appear in fullscreen mode. You may have to change the CSS to make the watermark appear the way you want it to depending on whether fullscreen is enabled or not, but you can watch the size of the video element to detect that. I was able to achieve this by editing the DOM on the video.js site (I just added an <h1>
right before the <video>
):
http://imgur.com/a/ABItT
There is a plugin for that already from videojs and it keeps the logo even if you want to watch it full screen. Also you can change the position of your logo.
https://github.com/xbgmsharp/videojs-watermark