I'm loading few videos with iframe on a page. Those videos have custom high Quality thumbnails that we've uploaded in youtube. We have the player in 1280px wide and it for the most of the time it doesn't load the max res thumbnail, but it goes for a low quality thumbnail.
So far I've been unable to understand how youtube decides which thumbnail to load. For the last couple of days it was loading the high quality thumbnail in firefox & IE, but it was taking the low resolution for chrome. Today it is the same in all browsers -> it loads the low quality image.
If you want to see it for yourself here is the site: http://wingtsun-akademie-heidelberg.de/new/
I've tried to force hd quality with the js iframe api:
player = new YT.Player(el, {
height: 1080,
width: 1920,
hd: 1,
events: {
'onStateChange': onPlayerStateChange
}
});
But it doesn't seem to have any effect? Do you have any idea if I can load a custom thumbnail by providing it to the player object?
Right now it seems that youtube loads most of the time: http://i3.ytimg.com/vi/WqK2IlP-JSE/hqdefault.jpg instead of: http://i3.ytimg.com/vi/WqK2IlP-JSE/maxresdefault.jpg
Thanks in advance for any suggestions.