herii-swipe

0.0.2 • Public • Published

Swipe

JavaScript to detect touch swipe left,right, up or down on any touchscreen device.

##Installation

Using git:

git clone https://github.com/Heriberto-Juarez/swipe.git

Using npm

npm i herii-swipe

How to use

Swipe is a class, so in order to use it we must create an instance of it:


let swipe = new Swipe();

To execute functions every time a swipe event is fired we need to call the "onSwipe"" method which receives 2 arguments:

  • Type
  • callback function

The possible types are:

  • right
  • left
  • up
  • down

And the callback function is a function that contains the code you want to execute.

Example:


swipe.onSwipe("right", function () {
    console.log("This is the code that is executed every swipe to the right");
});

swipe.onSwipe("down", function () {
    console.log("This is the code that is executed every swipe to the bottom of the screen (down)");
});

Target specific elements

By default document is the target that the event listener is attached to. We sometimes want to execute code if the swipe was fired on a specific DOM element.

To target a specific element we need to pass a parameter to the Swipe class, this parameter is an object containing key:value pairs.

The key in this case must be target and the value is some DOM object.

Example:

HMTL

<div id="gallery">
<div>

JS

let swipe = new Swipe({
    target: document.getElementById("gallery")
);

Package Sidebar

Install

npm i herii-swipe

Weekly Downloads

1

Version

0.0.2

License

MIT

Unpacked Size

16.3 kB

Total Files

9

Last publish

Collaborators

  • herii