beck24 / youtube-video-component

A web component for embedding lazy-loaded youtube videos

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Built With Stencil

youtube-video

A web component for displaying youtube videos in a lazy-loaded manner. Displays and loads only the video thumbnail until the user clicks, then it loads the player and auto-plays.

By default it takes the size of its container, but an explicity width/height can be passed as props.

See the demo: https://beck24.github.io/youtube-video-component/

See the component properties/css variables: https://github.com/beck24/youtube-video-component/blob/master/src/components/youtube-video/readme.md

Installation

Via script

Include the script in the document head

<script src="https://unpkg.com/@beck24/youtube-video/dist/youtube-video.js"></script>

Use the component in the body

<youtube-video src="http://youtu.be/C0DPdy98e4c" width="400px" height="300px" />

Via NPM

Install the module

npm install @beck24/youtube-video

About

A web component for embedding lazy-loaded youtube videos

License:MIT License


Languages

Language:HTML 59.5%Language:TypeScript 26.5%Language:CSS 14.0%