JSFiddle - React, Tailwind, and code Playground

by Oski Krawczyk

HTML

<link rel="stylesheet" href="http://github.com/oskarkrawczyk/floom/raw/master/Demos/floom/floom.css">
<script src="http://github.com/oskarkrawczyk/floom/raw/master/Source/floom.js"></script>
<link rel="stylesheet" href="http://github.com/oskarkrawczyk/floom/raw/master/Demos/screen.css">
<div id="blinds"></div>

JavaScript

// option 1        
var slides = [
    {
        image: 'http://farm3.static.flickr.com/2666/3848242888_673490ca57_m.jpg',
        caption: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit'
    },
    {
        image: 'http://farm4.static.flickr.com/3542/3847448147_a850c29d35_m.jpg',
        caption: 'Excepteur sint occaecat cupidatat non proident'
    },
    
];

// option 2
// var slides = $$('#blinds img');

$('blinds').floom(slides, {
    sliceFxIn: {
        top: 20
    }
});