add overlay text on embedded youtube video, dissapearing while video plays - html

I've embedded a youtube video on my website and I want to add some overlay text that will dissapear when the play button is clicked and while the video plays. I want it to be compatible with all browsers (IE 7+).
(Would it be better to use YouTube's text adding functionality??)

Related

How to disable youtube link from iframe

I'm embedding a youtube iframe video player in my website made with React. I don't want there any clickable link in that area, more specifically I want to restrict the youtube link to load from inside the iframe elements.
look at the red mark area, if I click there, it opens youtube.com
Is there any way to restrict "youtube.com" from my site that will prevent me to click or something like this?
modestbranding=1
This parameter lets you use a YouTube player that does not show a YouTube logo. Set the parameter value to 1 to prevent the YouTube logo from displaying in the control bar. Note that a small YouTube text label will still display in the upper-right corner of a paused video when the user's mouse pointer hovers over the player.
https://developers.google.com/youtube/player_parameters#modestbranding

HTML5 Video controls shrinking on page load

I need to integrate the HTML5 Video player in the page to run an MP4 video. This video is running within a carousel which on load does the slide width calculations, as the video original videos width managed through the CSS for with the width:100%.
The issue is when the page loads and the carousel initialises, the controls of the VIDEO do not expand full width of the video player. Once I click anywhere on the video, other than the play button, the control panel expands the full width, as it should.
BEFORE:
AFTER:

Rotating youtube video

I'm using html. I have embedded a Youtube video via youtube api. The page i'm working on meant to used by mobile users. So the problem is when the user clicks the fullscreen button on the video, it automatically goes wide screen. Like rotates 90 degree.

Html5 video fullscreen with the possibility to modify the video control via css

I'm trying to integrate a video player or youtube or vimeo in some way to my website.
I need to include a video in the background of the site in full screen.
I would like to have more than using css3 and html controls on the video at the top left for example ..
Do you know a player that you can gesire in this way?
Tnx

Draw text on top layer of video embed when it's fullscreen

Now, I embed video from youtube and I have a trouble Which I can't draw anything (text, image, etc.) when video is fullscreen. So, what can I do to draw text or image (div) to show it when video fullscreen. I tried to use z-index, but it's not successful. I want to make new controller for my video player don't user youtube controller, but video was embed from youtube. So, when user user fullscreen mod, I want to show a div which contains control like play, pause, etc. I already use ?wmode=transparent but it's not work with fullscreen, It mean my controller not showed when I stay in fulscreen mode
You haven't given much information, but this website details what you require, I think.
http://www.electrictoolbox.com/div-layers-float-over-flash-vimeo-youtube/