JSFiddle - React, Tailwind, and code Playground

HTML

<div id="all">
    <div id="left"> <a href="http://google.com/" id="fail">fail</a>

    </div>
    <div id="right"> <a href="#" id="click">click</a>

    </div>
</div>

CSS

#all.toggle #left {
    left:0;
}
#all.toggle #right {
    left:200px;
}
#left {
    width:200px;
    height:200px;
    left:-200px;
    position: absolute;
    top:0;
    background:red;
}
#right {
    width:200px;
    height:200px;
    left:0;
    position: absolute;
    top:0;
    background:green;
}
#fail, #click {
    display:block;
    color: white;
    height:100%;
    width:100%;
}

JavaScript

(function( window ) {

var
	document = window.document,
	utils = {};

utils.attachEvent = function( element, eventName, callback ) {
    if ( element.addEventListener ) {
        return element.addEventListener( eventName, callback, false );

    } else if ( element.attachEvent ) {
        return element.attachEvent( 'on' + eventName, callback );

    } else {
        return element[ 'on' + eventName ] = callback;
    }
};

utils.fireEvent = function( e ) {
    var oEvent = utils.createEvent( eventName );

    return document.createEvent ? e.target.dispatchEvent( oEvent ) : e.target.fireEvent( 'on' + e.eventType, e );
};

utils.createEvent = function( name ) {
    var evnt;

    if ( document.createEvent ) {
        evnt = document.createEvent( 'HTMLEvents' );
        evnt.initEvent( name, true, true );

    } else {
        evnt = document.createEventObject();
        evnt.eventType = name;
    }

    evnt.eventName = name;

    return evnt;
};

utils.getRealEvent = function( e ) {
    return e.originalEvent && e.originalEvent.touches && e.originalEvent.touches.length ? e.originalEvent.touches[ 0 ] : e;
};

var eventMatrix = [{
    // Touchable devices
    test: ( 'propertyIsEnumerable' in window || 'hasOwnProperty' in document ) && ( window.propertyIsEnumerable( 'ontouchstart' ) || document.hasOwnProperty( 'ontouchstart') ),
    events: {
        start: 'touchstart',
        move: 'touchmove',
        end: 'touchend'
    }
}, {
    // IE10
    test: window.navigator.msPointerEnabled,
    events: {
        start: 'MSPointerDown',
        move: 'MSPointerMove',
        end: 'MSPointerUp'
    }
}, {
    // Modern device agnostic web
    test: window.navigator.pointerEnabled,
    events: {
        start: 'pointerdown',
        move: 'pointermove',
        end: 'pointerup'
    }
}];

var attachDeviceEvent, init, handlers, deviceEvents,
    eventName = 'tap',
    fingerOffsetMax = 11,
    coords = {};

handlers = {
    start: function( e ) {
        e =...