https://github.com/code0wl/swipeable-menu

💨Simple JS framework agnostic swipeable menu for touch devices
https://github.com/code0wl/swipeable-menu

swipe

Last synced: about 1 month ago
JSON representation

💨Simple JS framework agnostic swipeable menu for touch devices

• Host: GitHub
• URL: https://github.com/code0wl/swipeable-menu
• Owner: code0wl
• Created: 2016-05-09T08:53:25.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2018-07-18T03:53:19.000Z (over 6 years ago)
• Last Synced: 2024-08-10T23:22:34.780Z (6 months ago)
• Topics: swipe
• Language: JavaScript
• Homepage:
• Size: 262 KB
• Stars: 16
• Watchers: 3
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Reveal menu UI

A performant swipeable list slide menu reveal that works on any framework just like apple mail or Gmail. The focus is simplicity.

 Try the demo on your mobile device  here 




## Installation

For a demo, after starting the project with npm start. Just open the index.html and debug in mobile view to get touch events.

```

npm start

```

## Usage

Check the HTML and CSS and it will all become clear to you. Basically they are two menus in the same div. One is ontop and the other is at the bottom.

(important!) Keep in mind that it is only listening to touch events, so mouse events will not work. This is by design.

Include the script and create a new instance by

```

var swiper = new SwipeableList({

    element: '.swipeable-list',

    threshold: 50, // force it takes to open the menu

    speed: .5, // animation speed in seconds

    size: 25 // in percentages

});

```