Minified - Slide/Fade Toggle

by tjansen

HTML

<script src="http://minifiedjs.com/download/minified-src.js"></script>
<div id="container"><div id="content">
Bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla. Bla bla bla.
Bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla. Bla bla bla.
Bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla. Bla bla bla.
</div></div>
<button id="fadeOutButton">Fade Out</button>
<button id="fadeInButton">Fade In</button>
<button id="slideOutButton">Slide Out</button>
<button id="slideInButton">Slide In</button>

CSS

#content { width: 300px; border: 1px solid black; padding: 0.5em; }

JavaScript

var MINI = require('minified'); 
var $ = MINI.$, $$ = MINI.$$, EE = MINI.EE;

$(function() {
    var fadeToggle = $('#container').toggle({$$fade: 1}, {$$fade: 0}, 800);
    var slideToggle = $('#container').toggle({$$slide: 1}, {$$slide: 0}, 800);

    $('#fadeOutButton').onClick(fadeToggle, [true]);
    $('#fadeInButton').onClick(fadeToggle, [false]);

    $('#slideOutButton').onClick(slideToggle, [false]);
    $('#slideInButton').onClick(slideToggle, [true]);

});