react-slider-page

A full screen page slider to slide with mouse, arrow-key and touches

Usage no npm install needed!

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

README

React Slider Page

React full-page slider component component

Github Pages Demo

Api

Use React-hooks or a Component and set your swipe(d) handlers.

import SliderPage from 'react-slider-page'

Component

<SliderPage>
  <section id="html">
    <div>HTML</div>
  </section>
  <section id="css">
    <div>CSS</div>
  </section>
  <section id="js">
    <div>JavaScript</div>
  </section>
  <section id="react">
    <div>React</div>
  </section>
  <section id="vue">
    <div>Vue</div>
  </section>
</SliderPage>

Props / Config Options

Props and configs are yet to be added :)

Development

Initial set up, with node 10+, run npm install.

Make changes/updates to the src/index.js file.

Please add tests if PR adds/changes functionality.

Verify updates with the examples

Build, run, and test examples locally: npm run start:examples

After the server starts you can then view the examples page with your changes at http://localhost:3000.

You can now make updates/changes to src/index.js and webpack will rebuild, then reload the page so you can test your changes!

License

MIT