gerhobbelt / bespoke-backdrop

Backdrop elements for Bespoke.js

bespoke-backdrop

Backdrop elements for Bespoke.js

Automatically generate background elements that can be styled and animated indepedently of your slide content.

Classes specified in data-bespoke-backdrop attributes will be added to the list of classes that are provided by default.

Download

Download the production version or the development version, or use a package manager.

Usage

var bespoke = require('bespoke'),
  backdrop = require('bespoke-backdrop');

bespoke.from('#presentation', [
  backdrop()
]);

Then add data-bespoke-backdrop attributes to your slides.

<article>

  <section>
    No backdrop
  </section>

  <section data-bespoke-backdrop="special">
    Special backdrop
  </section>

  <section data-bespoke-backdrop="super special">
    Super special backdrop
  </section>

</article>

Not using CommonJS? View the full Bespoke.js plugin documentation.

Classes

The following classes are provided on the backdrop elements:

bespoke-backdrop	Every backdrop element
bespoke-backdrop-active	The active backdrop
bespoke-backdrop-inactive	All inactive backdrops
bespoke-backdrop-before	All backdrops before the active backdrop
bespoke-backdrop-after	All backdrops after the active backdrop

Package managers

npm

$ npm install bespoke-backdrop

Bower

$ bower install bespoke-backdrop

Credits

This plugin was built with generator-bespokeplugin.

License

MIT License