Improved lazy loading for video, audio, and image

Use this solution for lazy loading of video, audio or image files.

Original article: Improved lazy loading for image, video, and audio.

Open developer tools and observe HTML structure or Network and how it changes, including events for pause and play.

Prague in 4K by Cities in 4K
Vienna in 4K by Cities in 4K

Lazy load video file in the CSS background

The video itself isn't actually played through the CSS background property, but rather as a standalone video wrapped in the flexible container.

Ljubljana in 4K by Cities in 4K