background-cover

Simulate 'background-size: cover' on HTMLVideoElement and HTMLImageElement.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
background-cover
0.1.12 years ago8 years agoMinified + gzip package size for background-cover in KB

Readme

background-cover
Simulate 'background-size: cover' on HTMLVideoElement and HTMLImageElement.

Syntax

BackgroundCover(element, container [, horizontalAlign, verticalAlign]);

  • element: HTMLVideoElement, or HTMLImageElement, or other dom element (e.g. HTMLCanvasElement)
  • horizontalAlign: Number from 0 to 1, where 0 means aligned to the left. Default value is 0.5 (centered);
  • verticalAlign: Number from 0 to 1, where 0 means aligned to the top. Default value is 0.5 (centered);

Example

var BackgroundCover = require('background-cover');

var videoContainer = document.getElementById('video-container');
var video = document.getElementById('video');

video.addEventListener('loadedmetadata', function() {
  BackgroundCover(video, videoContainer);
);
Check out tests for more examples.

Install

npm install background-cover --save
``` 
 
## Tests
```sh
npm run test-video
npm run test-image

License

MIT, see LICENSE.md for details.