plyr
plyr copied to clipboard
Poster doesn't show on Safari
While the poster shows perfectly on Firefox and Edge (MacOS) It does NOT show on Safari (17.4.1), there is a flicker and then the 1st frame is shown instead.
<video class="cell-video" title="Test"
data-ratio="4:3"
data-download="Test720.mp4"
data-poster="Test720.jpg"
data-src="Test720.mp4,Test720.webm"
data-type="video/mp4,video/webm"
data-size="360,360"
data-fit="fill">
</video>
this is not optimal for videos which don't have a good 1st frame (eg black frame) and you want a meaningful preview.
.plyr__poster { z-index: 3; }
.plyr__control { z-index: 4; }
these css changes first seemed to fix the problem, but then you can't cue after start