react-gallery-slider

React photos slider made mainly by css snap-scroll property

Usage no npm install needed!

<script type="module">
  import reactGallerySlider from 'https://cdn.skypack.dev/react-gallery-slider';
</script>

README

React Gallery Slider

Simple and convenient photo slider for your application! This component is basing on CSS snap-scroll property :boom:

Installation :wrench:

Install with npm:

npm install --save react-gallery-slider

or

Install with yarn:

yarn add react-gallery-slider

Getting Started :bulb:

const React = require('react');
const ReactDOM = require('react-dom');
const GallerySlider = require('react-gallery-slider');

const Photo = require("./img.jpg");
var photos = ["some url", Photo];

ReactDOM.render(
  <GallerySlider photos={photos} />,
  document.getElementById('container')
)

ES6

import React from "react";
import ReactDOM from 'react-dom';
import PhotoSlider from "./react-photo-slider";

import Photo from "./img.jpg";
var photos = ["some url", Photo];

ReactDOM.render(
  <GallerySlider photos={photos} />,
  document.getElementById('container')
)

Options :hammer:

  • photos - (array) Array of photos' urls (required)
  • activePhoto - (number) Index (starting from 0) of the current photo.
  • className - (string) Class name of the container element.
  • style - (object) Inline styles of the gallery container.

License :page_facing_up:

MIT

Made by Karol Waliszewski with :heart: