Button to embed video iframe (v2)

Currently v2.0 is in use on the Tesco Bake-off page.

Play the Bake-off video Play the Tannoy-takeover video

Description

For technical reasons, at Tesco we cannot hijack a link to embed a video.
We tried using images but the tap/click didn't track.
Our solution; use a button.

This version will launch a video from most objects: anchors, buttons, divs, spans, images.
Roles and behaviours are amended to suit.

All layout is in the CSS and the only magic number is the 16:9 ratio.

Tested

PC: IE9 - Edge, Firefox, Chrome.
Mac: Firefox, Chrome, Safari.
No mobile testing as yet.

Single video example

Play the Tannoy-takeover video

Sent for testing to the Digital Accessibility Centre.

Play video Loading

Pens by Mike FoskettwebSemantics