Core API

Project Setup

This project assumes you have NodeJS. You should also have npm installed as well (npm usually comes packaged with Node). Once you have it cloned, you should run npm install to get all the dependencies.

Finally, run one of the following commands in the cloned directory:

• npm run dev: This starts a dev server with autoreload on the port 8080.
• npm run build: This creates the dist files.

JavaScript

In order to bootstrap the WebSlides you'll need to create a instance of it:

const ws = new WebSlides();

That'll make everything run without any hassle. Note that we're using a convention over configuration here, for WebSlides to actually work you need a container with an id of webslides' and

` elements inside of it. If in doubt, check any of our demos for inspiration and guidance.

Options

WebSlides constructor accepts an object with options.

Param	Type	Default	Description
autoslide	number or boolean	false	Amount of milliseconds to wait to go to next slide automatically.
changeOnClick	boolean	false	If true, clicking on the page will go to the next slide unless it's a clickable element. See ClickToNav docs for more info.
loop	boolean	true	Lets WebSlides loop the slides so once it reaches the end, going next will make it go to the first slide.
minWheelDelta	number	40	Controls the amount of scroll needed to trigger a navigation. Lower this number to decrease the scroll resistance.
scrollWait	number	450	Controls the amount of time needed to wait for a scroll transition to happen again.
slideOffset	number	50	Amount of sliding needed to trigger a new navigation.

const ws = new WebSlides({
  autoslide = false,
  changeOnClick = false,
  minWheelDelta = 40,
  scrollWait = 450,
  slideOffset = 50
});

API

Do you want to get your hands dirty? This is the API for the WebSlides module:

goToSlide(slideIndex, forward)

Goes to a given slide.

goNext()

Goes to the next slide.

goPrev()

Goes to the previous slide.

registerPlugin(key, cto)

Registers a plugin to be loaded when the instance is created. It allows (on purpose) to replace default plugins.

goToSlide(slideI, forward)

Goes to a given slide.

| Param | Type | Description | | --- | --- | --- | --- | | slideIndex | number | The slide index. | | forward | boolean | Whether we're forcing moving forward/backwards. This parameter is used only from the goNext, goPrev functions to adjust the scroll animations. |

goNext()

Goes to the next slide. If the page is vertical, it will animate the scroll down.

goPrev()

Goes to the previous slide. If the page is vertical, it will animate the scroll up

registerPlugin(key, cto)

Registers a plugin to be loaded when the instance is created. It allows (on purpose) to replace default plugins.

Those being:

• autoslide
• clickNav
• grid
• hash
• keyboard
• nav
• scroll
• touch
• video
• youtube

Param	Type	Description
key	string	They key under which it'll be stored inside of the instance, inside the plugins dict.
cto	function	Plugin constructor.