This is really cool! It’d be even better if you added “playsinline” attributes to your video elements so your videos didn’t play in fullscreen on iPhones.

Done! I took a bit of a shotgun approach because I don't have an iOS device to test, and the documentation on playsinline seems lacking (or at least non-standard). Hope that works!

Will do!

That should have stopped happening in iOS 11.4. If you’ve upgraded to-or-past that and you’re still seeing that happen, please let me know: email in profile or @jernoble on Twitter.

Noticed it only a week ago, but since upgrading to 12.0 I can no longer reproduce. Awesome!

Interesting. At 1.10 cars per household, and 2.26 people per household, about 47% of SF residents own cars. (Though subtracting out the under-18 population means 55% of driving-age residents own a car.) Also, given there must be some people who own more than one, the actual percentage is probably lower. Still, that's a lower number than I imagined.

A "keypress" event counts as a user gesture, so as long as your code looks like:

document.addEventListener('keypress', event => { if (event.key === 'space') video.play(); });

...then everything should just work fine.

> ...it drives me nuts that Safari@iOS can't do inline play at all...

Safari on iOS can now do inline playback! Just add a "playsinline" attribute to your <video> element: https://webkit.org/blog/6784/new-video-policies-for-ios/

Also make sure to remove the audio track!

You can now change this setting either globally, or on a per-website basis in Safari Technology Preview 32: https://webkit.org/blog/7627/safari-technology-preview-32/

The options are: "Allow all Auto Play", "Stop Media with Sound" (the default), and "Never Auto Play".

Site authors following the best practices section in the WebKit.org blog should provide a play button for video-backed-gifs when "Never Auto Play" causes automatic playback to block.