JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body bgcolor='black'>
<div id="map"></div>
<!--<div id="user"></div>-->
</body>
</html>

CSS

body
{
	margin: 0px;
	padding: 0px; 
}

#map{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 5000px;
	height: 5000px;
	background-image: url("http://www.gamedev.ru/files/images/grass_3.jpg");
}
#user{
	position: relative;
	width: 200px;
	height: 200px;
	background-image: url("user.png");
}

JavaScript

function moveUser(e) {
	$("#user").stop();
    $("#user").animate({
    left:e.pageX,
    top: e.pageY
  }, 5000);
}

// $("#map").mousedown(function(e) {
	// var x = e.pageX;
	// var y = e.pageY;
	// $("#map").mousemove(function(event) {
	  // $('body, html').scrollTop(event.pageY);
	  // $('body, html').scrollLeft(event.pageX);
	// });
	// //alert($('body, html').scrollTop() +" - "+$('body, html').scrollLeft());
// });



var mouseStillDown = false;
$("#map").mousedown(function(event) {
    mouseStillDown = true;
    doSomething(event);
});

function doSomething(event) {
	
	
	var x = event.clientX;
	var y = event.clientY;
	
	
	
	
    if (!mouseStillDown) { return; } // we could have come back from
                                    // SetInterval and the mouse is no longer down
									// do something
    if (mouseStillDown) { 
		
		
		
		$("#map").mousemove(function(e) {
			
				if(e.clientY > y)
				{
					var posTop = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
					var pluseY = posTop - (e.clientY - y);
					$('body, html').scrollTop(pluseY);
					y = e.clientY;
				}
					
				if(e.clientX > x)
				{
					var posLeft = (window.pageXOffset !== undefined) ? window.pageXOffset : (document.documentElement || document.body.parentNode || document.body).scrollLeft;
					var pluseX = posLeft - (e.clientX - x);
					$('body, html').scrollLeft(pluseX);
					x = e.clientX;
				}
			
				if(e.clientY < y)
				{
					var posTop = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
					var pluseY = posTop + (y - e.clientY);
					$('body, html').scrollTop(pluseY);
					y = e.clientY;
				}
					
				if(e.clientX < x)
				{
					var posLeft = (window.pageXOffset !== undefined) ? window.pageXOffset : (document.documentElement || document.body.parentNode ||...