Package Exports

fullscreen-iframe-content

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (fullscreen-iframe-content) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Fullscreen iFrame Content

Ensures the full content of an iframe, rather than the iframe itself, fills the screen. Great for background video using YouTube, Vimeo, etc.

Implement

npm install fullscreen-iframe-content

Prepare your html:

.iframe-container
  iframe.iframe(src="https://www.youtube.com/embed/3ge75lXiaMg?autoplay=1&loop=1&playlist=3ge75lXiaMg&showinfo=0" frameborder="0" allowfullscreen width height)

Depending on where you're using the iframe, you'll want overflow:hidden on the overall container (possibly body / html). All other styles are applied from the module.

Once imported, call the module:

import iframe from 'fullscreen-iframe-content'

export default (app) => {

  iframe.fullscreenContent('.iframe-container', '.iframe', 16, 9);

}

The function takes 4 arguments: (iframe container class, iframe class, aspect ratio x, aspect ratio y)