Swipe Event
Swipe event is triggered when the user swipes on a gesture-enabled element. The following table defines the triggered event.
Table of Contents
Swipe Event
| Event | Description |
|---|---|
| swipe | Triggered when the user swipes the target element. |
Options
| Option | Type | Description |
|---|---|---|
| velocity | Integer | Minimum required velocity before the swipe event is triggered. |
| orientation | String | Swipe orientation.
The possible values are vertical and horizontal. |
| timeThreshold | Integer | Time threshold for detecting a swipe event. |
Example
The following shows how to use swipe events.
HTML
<div class="ui-page ui-page-active" id="pageSwipe"> <header class="ui-header"> <h2 class="ui-title">Swipe Event</h2> </header> <div id="content" class="ui-content content-padding"></div> </div>
Javascript
(function() {
var page = document.getElementById("pageSwipe");
page.addEventListener("pagebeforeshow", function() {
var content = document.getElementById("content");
tau.event.enableGesture(content, new tau.event.gesture.Swipe( {
orientation: "horizontal"
}));
content.addEventListener("swipe", function(e) {
console.log("swipe direction = " + e.detail.direction);
});
});
}());