YouTip LogoYouTip

Event Swipe

jQuery Mobile swipe event

jQuery Mobile swipe event

-- Learning is not just about technology, but also about dreams!

jQuery Mobile Tutorial

jQuery Mobile Tutorial jQuery Mobile Introduction jQuery Mobile Installation jQuery Mobile Pages jQuery Mobile Transitions jQuery Mobile Buttons jQuery Mobile Button Icons jQuery Mobile Popups jQuery Mobile Toolbars jQuery Mobile Navbars jQuery Mobile Panels jQuery Mobile Collapsibles jQuery Mobile Tables jQuery Mobile Grids

jQuery Mobile Lists

jQuery Mobile List Views jQuery Mobile List Content jQuery Mobile Filters

jQuery Mobile Forms

jQuery Mobile Forms jQuery Mobile Form Inputs jQuery Mobile Form Select jQuery Mobile Form Sliders

jQuery Mobile Themes

jQuery Mobile Themes

jQuery Mobile Events

jQuery Mobile Events jQuery Mobile Touch Events jQuery Mobile Scroll Events jQuery Mobile Orientation Change Events jQuery Mobile Examples jQuery Mobile Data Attributes jQuery Mobile Icons jQuery Mobile Events jQuery Mobile Page Events jQuery Mobile CSS Classes

jQuery Mobile Icons

jQuery Mobile Page Events

jQuery Mobile swipe event

jQuery Mobile Events jQuery Mobile Events

Example

Hide the element <p> on horizontal swipe:

$("p").on("swipe",function(){
  $(this).hide();
});

Try it Β»


Definition and Usage

The swipe event is triggered when the user swipes more than 30px horizontally (and less than 75px vertically).

Tip: You can swipe quickly in both left and right directions.

Related Events:

  • swipeleft - Triggered when the user swipes more than 30px from left to right over an element.
  • swiperight - Triggered when the user swipes more than 30px from right to left over an element.

Syntax

$(selector).on("swipe",function(event){...})
Parameter Description
function(event) Required. Specifies the function to run when the swipe event is triggered. The function has an optional event object, which can be any jQuery event property (e.g., event.target, event.type, etc.). For more information, see the jQuery Events Reference.

More Examples

Event Object

Use the event.target property to return the DOM element that triggered the swipe event.


jQuery Mobile Events jQuery Mobile Events

jQuery Mobile Icons

jQuery Mobile Page Events

← Event SwipeleftEvent Scrollstop β†’