slide around html elements
Show and hide html elements to build UI widgets.
Map all the slides to html elements, in this case using yarnify:
var swoop = ;var domready = ;var yarn = ;;
Write some html files like this
Everywhere you put a
class="link" with a hash href turns into a special link
that advances to the slide name.
Bundle it all up:
$ yarnify slides/ -o yarn.js$ browserify entry.js -o bundle.js
Drop down an
var swoop = ;
Create a new swoop object
sw from an optional hash
slides mapping slide
names to html elements.
Add a slide with
name as an html
Show the slide
name, hiding the previous slide.
Append the swoop ui to the target
Set the size of the slide viewer element.
Override the default transition between
next slides for
This function only works to prevent the default transition on the same tick as
Explicitly add slide listeners for
class="link" with relative slide name hash
hrefs to the DOM Element
element. This is useful if you want to link to slides
from container elements that are not slides themselves.
.show() is called or a
class="link" element with a slide href
next are the string names of the slides being transitioned between.
Elements in your slides with
class="link" and a hash href turn into a special
links that advance to a particular slide.
You can also set
href="#_back" to advance to the previous slide.
With npm do:
npm install swoop