Skip to content
Display a preview for your video inputs
JavaScript CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github
docs
.gitignore
LICENSE
README.md
VideoInputPreview.js
VideoInputPreview.less
VideoInputPreview.min.css
VideoInputPreview.min.js
package.json

README.md

Video Input Preview (Demo)

Display a preview for your video inputs easily

Doc

  • Installation

Simply import video-input-preview into your HTML.

<link rel="stylesheet" type="text/css" href="https://unpkg.com/video-input-preview@0.0.3/VideoInputPreview.min.css">
<script src="https://unpkg.com/video-input-preview@0.0.3/VideoInputPreview.min.js"></script>
  • Documentation

See the offical documentation for more in-depth informations.

  • How to use

You can either use data attributes or the VideoInputAttribute class to initialyze your inputs:

<input type="file" accept="video/*" data-video-preview="https://link.to.your.preview.mp4">
// OR
let preview = new VideoInputPreview(input, {
  preview: 'https://link.to.your/preview.mp4',        // Optional | Preview displayed
  uploadIcon: 'https://link.to.your.upload/icon.png', // Optional | Icon used when no preview is displayed
  lang: 'en',                                         // Optional | Language used
  dictionary: null                                    // Optional | Allow for custom language
});
  • Methods

See the documentation for the method definitions.

  • Example

See this JSFiddle for a working example

Authors

You can’t perform that action at this time.