JSFiddle - React, Tailwind, and code Playground
HTML
<a href="#">If you press and leave it means you dragged, if not you are just clicking</a>
<div id="result" />
JavaScript
var clicked = true,
tOut;
$('a').on('click', function (e) {
e.preventDefault();
}).on('mousedown', function () {
tOut = setTimeout(function () {
clicked = false;
}, 200);
}).on('mouseup', function () {
if (clicked == true) {
clearTimeout(tOut);
my_function();
} else {
clicked = true;
$('<p>Dragged</p>').appendTo('#result');
}
});
function my_function() {
$('<p>Clicked</p>').appendTo('#result');
}