Skip to content
This repository has been archived by the owner on Oct 13, 2020. It is now read-only.

Latest commit

 

History

History
49 lines (38 loc) · 936 Bytes

README.md

File metadata and controls

49 lines (38 loc) · 936 Bytes

What is this?

This is a responsive video section with content overlay. In other other words, this is a responsive hero section with a video as background that you can overlay content on top of.

It supports YouTube and Vimeo.

How to use it?

Install it:

npm i vue-video-hero

Inside your .vue component:

<template>
  // ...
  <vue-video-hero source="youtube || vimeo" videoId="_XcsNhdz-kM">
  // For YouTube:
 // https://youtu.be/[_XcsNhdz-kM] <-- this is the id
 // For Vimeo:
 // https://vimeo.com/[123456789] <-- this is the id
  <template #content>
    // Put your content here
  </template>
 </vue-video-hero>
</template>

<script>
// ...
import VueVideoHero from 'vue-video-hero'
// ...
components: {
  // ...
  VueVideoHero,
}
// ...
</script>

Defaults

Currently unchangeable

  • Auto play on all devices (except iOS < 10)
  • Muted audio
  • Loops automatically (the video never ends)