angular-video-background
light module for using any video as background with many options
DEMO
Getting started:
Download the module using npm package manager:
npm install angular-video-background
with bower package manager:
bower install --save angular-videos-background
or download it directly from GitHub.
Add the style to your header:
Add the script to your body:
and than add the module to your application dependencies:
angular
and you can start to use the directive video-background it in your application.
Basic usage:
The directive most important attribute that must be specified in order to work correctly. The attribute is source, that specify the object with the source/s of the video in the format type: "source".
// example source object$scopemyVideo = mp4: "public/myvideo.mp4" ogg: "public/myvideo.ogg"
Note: you must pass a object to the source attribute.
You can optionally bind keyboard press to video controls by using key-controls attribute.
Directive attributes:
- source: the object containing the video source/s
- autoplay: set the video auto play attribute (default true)
- volume: an number value from 0 to 1 to set the initial volume
- autopause: autopause the video in case of seeking
- key-controls: if the attribute is specified will bind keyboard controls
- show-time: enable or disable the current time view
- on-firstplay: a callback to run when the video play for the first time
- on-firstend: a callback to run when the video ends for the first time
- start-time: specify a custom start time for the video (expressed in int/float es: 1.50)
- end-time: specify a custom end time for the video (expressed in int/float es: 17.25)
Examples:
source
The object containing the source/s of the video to show. This attribute is necessary for the directive to work.
auto-play
The autoplay attribute will start the video when it's ready to play. (like the normal html autoplay attribute)
start-time
Specify a custom start time for the video, pass a number, can be a float.
end-time
Specify a custom end time for the video, pass a number, can be a float.
initial volume
Start the video with initial volume of 0
autoplay & autopause
Specify a custom end time for the video, pass a number, can be a float.
enable keyboard controls
Specify a custom end time for the video, pass a number, can be a float.