iOS <video> preview in Chrome - html

On an iphone, videos that I'm loading through a element appear with the immovable iOS play button overlay.
When viewing the site in the Chrome browser, I'm able to see the first frame of each video behind the play button. In Safari for iOS, I only see the play button and the blank video player behind it.
I would like users to see the video preview in both browsers the way they can when using Chrome. How can I achieve this in iOS Safari?

Related

youtube Iframe video not working on safari

When i Click on the full screen option in Safari, the video gets enlarged in half of the screen than full.
I have used basic iframe from youtube video. I used it in a custom website. What can be the issue here ? Kindly Please help me out.
This explains it https://tubularinsights.com/youtube-adds-iframe-embed-code-no-iphone/
and Making youtube.com/embed URLs work on iOS
also its is a duplicate to these two :
youtube embed video not working with safari
YouTube embed iframe not showing in Safari

Chrome blurred text with video element

I'm developing a web app and in one of my pages I have a video element that shows the user's webcam video.
I noticed the page was a little blurry and then I was messing with the developer tools and deleted the video element and now the page was really sharp.
Images:
The first image is the slightly blurred page with the video element and the second one is the sharp one without video element.
The page looks fine on Firefox but not on Chrome.
Chrome version: 47.0.2526.106 m

Youtube embed does not fill the screen when pressing the fullscreen button

When pressing the fullscreen button on any embedded youtube video Chrome & IE (strangely Opera webkit works fine) acts as though I have pressed F11.
http://www.babymetalfan.com/discography/babymetal-2014/01-babymetal-death/
I have tried adjusting z-index values but no luck so far.
Edit: I fixed the video here by forcing the embed to use the flash player: http://www.babymetalfan.com/2014/07/08/babymetal-the-forum-london-7-7-14-ii-ne-proshot-video/ The issue still exists on all my html5 embeds.

Vimeo embed iframe not visible in IE11

I append iframes containing vimeo embed code to a website, hide the iframes and display the first one when it is loaded.
Works in: Chrome, Safari, Firefox, IE 9-11 on Win7 and IE10 on Win8
Does not work in: Internet Explorer 11 on Win8.1
It shows me a black box, I can press the invisible play button and there's sound, but there's nothing to see.
Funny thing: by resizing the browser window the iframe magically appears and video playback works.
There are some oddities relating to loading players from a display: none state. For now you could try a workaround I've used a few times and that is firing a fake resize event when you want the player to load, something like this:
window.dispatchEvent(new Event( 'resize', true, true ));
(Sorry for any typos, I'm on my phone.)

VideoJS and Blackberry10 Full Screen Mode

HTML5 full-screen overlay is behind content text.
It appears that any content after the video is displayed, renders above the video on full-screen.
The blackberry developer tools were no help when trying to find the issue, or change z-indexes on various elements.
Is there a hook for html5 in blackberry that I can get to display above the content?
Is this a Blackberry bug or a VideoJS bug?