html - How to get HTML5 video thumbnail without using poster on safari or iOS?

Question

I have embedded HTML5 video with mp4 format. How to get thumbnail image like poster without using "poster" attribute. This problem coming on Safari and iOS. I have added video like below mentioned code.

<video height=350 id='TestVideo' webkit-playsinline><source src='test.mp4' type=video/mp4></video>

On Chrome, IE, Firefox first frame of video coming as thumbnail image, but not coming on Safari and iOS.

Answer 1

simply add preload="metadata" in video tag and set #t=0.1 at url src, it will get the frame of 0.1s of your video as thumbnail

however, the disadvantage of this solution is when you click to play the video, it always start at 0.1s

<video preload="metadata" controls>
    <source src="video.mp4#t=0.1" type="video/mp4">
</video>