Mobile-first method for handling embedded video player sizes?
I see several ways to deal with layouts, sharing, etc. to deal with image sizes, but I haven't come across any information about video player size. For example with viewbix, voo, jw or any other js device serving a video player, the player size is embedded in embed. It also has an associated image file for the poster frame.
Just wondering how other people approach this. Are you doing multiple inline and image versions for different breakpoint sizes? Does it matter if the attachment is too large? Not sure if this is affecting the stream rate or not, or if the video itself does anything until the game is clicked. The image would still be a problem though, since using a full screen desktop width image on a 320px screen seems like a waste.
What's a smart way to handle this globally?
THH
source to share
With JW Player, we have responsive support built into the player - http://www.jwplayer.com/blog/new-in-jw-player-responsive-design/ so you don't have to worry about breakpoints, media queries or something like that. They will all be processed in your CSS.
jwplayer("myResponsiveVideo").setup({
file: "/assets/tearsofsteel.mp4",
image: "/assets/tearsofsteel.jpg",
width: "100%",
aspectratio: "12:5"
});
Basically, this setting will make the player responsive, no matter what container it is in.
source to share