react-fullscreen-slideshow v1.2.0

react-fullscreen-slideshow

A simple React image fullscreen slideshow component

View Demo

Features

• Full screen modal slideshow with thumbnail navigation
• Slideshow preview which can be clicked on for the fullscreen view.
• Display captions and big descriptions along with the images
• The View All view can be used for navigating galleries with large number of images

Installation

npm install --save react-fullscreen-slideshow

Usage

An example using react-fullscreen-slideshow

import React, { Component } from 'react';
import ReactFullscreenSlideshow from 'react-fullscreen-slideshow';

const images = [
    {
        image: 'images/image_1.jpg',
        caption: 'Caption for image_1',
        description: 'Description for image_1'
    },
    {
        image: 'images/image_2.jpg',
        caption: 'Caption for image_2',
        description: 'Very big description for image_2'
    },
    {
        image: 'images/image_3.jpg',
        caption: 'Image with no description'
    }
];

class App extends Component {
  render() {
    return (
        <div className="App"> 
            <ReactFullscreenSlideshow images={images} title={"Example Image slideshow"}/>
        </div>
    );
  }
}
export default App;

Props

License

MIT