Skip to content

sdbernard/igv

This branch is 2 commits behind callumlocke/igv:master.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

f448977 · Dec 18, 2013

History

13 Commits
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 17, 2013
Dec 18, 2013
Dec 17, 2013
Dec 17, 2013

Repository files navigation

IGV

Usage

You could just install this repo as a bower component and include the files from it.

  1. Include igv.js and igv.scss in your project. (Requires jQuery.)
  2. Set data-igv-* attributes on one or more DIVs (see below).
  3. Call IGV.run() whenever you're ready for it to enhance the elements.

Data attributes

  • data-igv="foo"required – sets the video name, used for loading files (foo.mp4, foo.webm, etc.)
  • data-igv-loop – optional – makes this an auto-playing, looping video, which will be paused whenever the element is no longer in view.
  • data-igv-scrollelement=".some-class" – optional, only for use in conjunction with data-igv-loop – this sets the video's closest ancestor that matches the given selector as the element whose scroll position will be tracked (for auto-pausing purposes).
  • data-igv-playbutton – adds a play button
  • data-igv-subtitles – IGV will load a subs file too (foo.srt), and load a special version for iOS which has hardcoded subs (foo.subs.mp4).

JavaScript API

IGV.debug = true; // to see debug info
IGV.visibilityThreshold = 50; // default=100
IGV.enableLoopingVideos = false; // eg, if (!Modernizr.videodesktop)

// Set video defaults for 
var defaults = {
  baseURL: '//interactivegraphics.ft-static.com/sites/2013/seasonal-appeal/videos/'
};

IGV.run(defaults, function () {
  // videos have now been set up
});

CSS

The IGV element has these classes added automatically: igv, igv--playing, igv--paused

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published