JSFiddle - React, Tailwind, and code Playground

HTML

<div id="touch4" class="dragx" style="">
    <div class="left">test</div>
    <div class="right">fdgssda</div>
</div>

CSS

body, html{margin:0;padding:0;top:0;left:0;}
.dragx {
    width: 640px;
    height: 400px;
    background-color:#999;
    margin:0;padding:0;top:0px;left:0;
}
.left {
    float:left;
    background-color:#acacac;
}
.right {
    float:right;
    background-color:#000000;
    color:#ffffff;
    height:100%;
    width:320px;
}

JavaScript

$().ready(function() {
    setInterval(checkOrientAndLocation, 1000);
    $('.dragx').touch({
        animate: false,
        sticky: false,
        dragx: true,
        dragy: false,
        rotate: false,
        resort: true,
        scale: false
    });
});


// DEFINE DEFAULT VARIABLES
var _target=null, _dragx=null, _dragy=null, _rotate=null, _resort=null;
var _dragging=false, _sizing=false, _animate=false;
var _rotating=0, _width=0, _height=0, _left=0, _top=0, _xspeed=0, _yspeed=0;
var _zindex=1000;

jQuery.fn.touch = function(settings) {

    // DEFINE DEFAULT TOUCH SETTINGS
    settings = jQuery.extend({
        animate: true,
        sticky: false,
        dragx: true,
        dragy: true,
        rotate: false,
        resort: true,
        scale: false
    }, settings);
    
    // BUILD SETTINGS OBJECT
    var opts = [];
    opts = $.extend({}, $.fn.touch.defaults, settings);
    
    // ADD METHODS TO OBJECT
    this.each(function(){
        this.opts = opts;
        this.ontouchstart = touchstart;
        this.ontouchend = touchend;
        this.ontouchmove = touchmove;
        this.ongesturestart = gesturestart;
        this.ongesturechange = gesturechange;
        this.ongestureend = gestureend;
    });
};
function touchstart(e){
    _target = this.id;
    _dragx = this.opts.dragx;
    _dragy = this.opts.dragy;
    _resort = this.opts.resort;
    _animate = this.opts.animate;
    _xspeed = 0;
    _yspeed = 0;

    $(e.changedTouches).each(function(){
                                      
        var curLeft = ($('#'+_target).css("left") == 'auto') ? this.pageX : parseInt($('#'+_target).css("left"));
        var curTop = ($('#'+_target).css("top") == 'auto') ? this.pageY : parseInt($('#'+_target).css("top"));
        
        if(!_dragging && !_sizing){
            _left = (e.pageX - curLeft);
            _top = (e.pageY - curTop);
            _dragging = [_left,_top];
            if(_resort){
                _zindex =...