<!DOCTYPE html>
<
html
lang
=
"en"
>
<
head
>
<
link
rel
=
"stylesheet"
href
=
"jqwidgets/styles/jqx.base.css"
type
=
"text/css"
/>
<
script
type
=
"text/javascript"
src
=
"scripts/jquery.js"
>
</
script
>
<
script
type
=
"text/javascript"
src
=
"jqwidgets/jqxcore.js"
>
</
script
>
<
script
type
=
"text/javascript"
src
=
"jqwidgets/jqxtouch.js"
>
</
script
>
<
script
type
=
"text/javascript"
src
=
"scripts/jqx-all.js"
>
</
script
>
</
head
>
<
body
>
<
center
>
<
h1
style
=
"color: green;"
>
GeeksforGeeks
</
h1
>
<
h3
>
jQWidgets jqxTouch tapHoldDelay Property
</
h3
>
<
div
id
=
"jqx_Touch"
>
<
div
style="height: 100px;
width: 350px;
color: black;
border-radius: 10px;
background: green;">
<
b
>Swipe, Swipe Left, Swipe Right and Tap</
b
>
</
div
>
</
div
>
<
input
type
=
"button"
style
=
"margin: 28px;"
id
=
"button_for_tapHoldDelay"
value
=
"Value of the tapHoldDelay property"
/>
<
div
id
=
"log"
></
div
>
<
script
type
=
"text/javascript"
>
$(document).ready(function () {
$('#jqx_Touch').jqxTouch({
tapHoldDelay: 2500
});
$('#jqx_Touch').on('swipeleft', function () {
$("#log").html("Swiped left");
});
$('#jqx_Touch').on('swiperight', function () {
$("#log").html("Swiped right");
});
$('#jqx_Touch').on('tap', function () {
$("#log").html("Tapped");
});
$('#jqx_Touch').on('swipe', function () {
$("#log").html("Swiped");
});
$("#button_for_tapHoldDelay").
jqxButton({
width: 300
});
$("#button_for_tapHoldDelay").click(
function () {
var tapHoldDelay_Value =
$('#jqx_Touch').
jqxTouch('tapHoldDelay');
$("#log").html(tapHoldDelay_Value);
});
});
</
script
>
</
center
>
</
body
>
</
html
>