JSFiddle - React, Tailwind, and code Playground

by steveambielli

HTML

<div id="surface"></div>

CSS

#surface {
    width: 500px;
    height: 500px;
    background: #ccc;
}

JavaScript

$(function() {    
    $("#surface")
        .on('mousedown touchstart', function (e) {
            console.log("(x,y) = (" + e.pageX + "," + e.pageY +")");
            xDown = e.pageX;
            yDown = e.pageY;
        })
        .on('mouseup touchend',function (e) {
            console.log("(x,y) = (" + e.pageX + "," + e.pageY +")");
            xUp = e.pageX;
            yUp = e.pageY;
            if (xDown != xUp || yDown != yUp) {
                alert('Swiped');   
            }
        })
    ;    
})(jQuery);