React Gallery

Elegant gallery with swipe.

Check it out
ferndopolis.github.io/react-gallery

Basic Usage

Pass items to Gallery as an array.

``jsx import React, {Component} from 'react' import Gallery from '../lib/Gallery'

const images = [ { title: 'Image-1', width: '800', height: '650' }, { title: 'Image-2', width: '1000', height: '1000'}, { title: 'Image-3', width: '400', height: '650' } ]

const items = images.map(( item, i ) => { var src = "https://unsplash.it/" + item.width + "/" + item.height + "/?random"; return (


            {item.title}


    )
})
// add content to items
items.push(
    

        
            Some Random Text

            Sociis risus nisi ridiculus urn?

        

    

)
// add embeded video
items.push(
    

        
                          webkitallowfullscreen mozallowfullscreen allowFullScreen>
        

    

)
class App extends Component {
    render() {
        return (
            

                
                   {items}
                
            

        )
    }
}


Props
|Property|Type|Default|Description|
|--------|----|-------|-----------|
| loop | bool | false | inifinte loop through gallery |
| animate | string | null | optional animate style [ 'slideLR', 'slideUD', 'fade' ] |

Local Development

npm install npm test run test. npm start start development server. npm run watch watch and build bundle.

Point browser to localhost:8080`