Dee’s ‘fingers crossed’ paprika burgers

Remember results day? Awful, wasn’t it? The waiting. The anticipation. Dee’s son, Jamie, is getting his A level results today – and he’s feeling nervous. Dee is too, truth be told. She’s praying all his hard work has paid off. But whatever happens, she wants Jamie to know how proud she is of him. So she’ll be making him his favourite paprika burgers – topped with oozing cheese and a generous spoonful of paprika mayo – whether he’s celebrating or in need of a bit of comfort. They were lucky last time, though. So fingers crossed.

Proof of concept

Video loop should be 20–40 seconds long. The current version is far too short for production usage but perfect for testing.

Will handle multiple videos. Each with custom start & end points.

The blank screen between videos is covered by an animated static image.

Video height is defined by the height of the containers text content.
Video width is set (height * 16 / 9) to maintain the aspect ratio.
If the viewport is not that wide then the video is cropped from the right.
If the viewport is wider than the video width then the video height is recalculated (viewport width / 9 * 16)

Support required down to IE9.

Recommendations

References