Awesome
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:
<table> <tr> <td><b>bespoke-backdrop</b></td> <td>Every backdrop element</td> </tr> <tr> <td><b>bespoke-backdrop-active</b></td> <td>The active backdrop</td> </tr> <tr> <td><b>bespoke-backdrop-inactive</b></td> <td>All inactive backdrops</td> </tr> <tr> <td><b>bespoke-backdrop-before</b></td> <td>All backdrops before the active backdrop</td> </tr> <tr> <td><b>bespoke-backdrop-after</b></td> <td>All backdrops after the active backdrop</td> </tr> </table>Package managers
npm
$ npm install bespoke-backdrop
Bower
$ bower install bespoke-backdrop
Credits
This plugin was built with generator-bespokeplugin.