Lazy Loading for HTML5 Video Posters

Question

I followed documentation for lazy posters on HTML5 Videos, replacing 'poster' to 'data poster' along with .lazy and it works on desktop Firefox and desktop Safari, however mobile Safari does not follow lazy loading and rather doesn't load posters beyond what is shown on phone viewport. Running web inspector on iPhone shows error being thrown "Failed to load resource: the server responded with a status of 404 ()" attributed to file "fullvid.js". I am able to tweak file fullvid.js (line 55) and g…

SemiColonWeb · Accepted Answer

Hello,

Thank You so so much for reporting this! When using the Lazy Loading for Video Posters, it is required to check for the Data Posters as well. This is our mistake as we had not taken this into consideration. Using the following code as mentioned by you will work fine:
[ch_pre type="js"]var placeholderImg = elVideo.getAttribute('poster') || elVideo.getAttribute('data-poster');[/ch_pre]

We will definitely add this code in the next update. Thanks for your Patience and your Super Useful contribution to this issue.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

pardthemonster · Answer

This change was not included on v7.3

Semicolon Web · Answer

Hello,

Apologies for the Inconveniences!

Yes, we seem to have missed adding this to the Update. Apologies for the same and we will definitely add this to the next update we plan to release later this week. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.