JSFiddle - React, Tailwind, and code Playground

by hollanditkzn

HTML

<div id="KonstrModul">
			<canvas id="textImgKonstr" class="draggable">
			</canvas>
			<div id="blockColor">
				<div id="blockColor1">
					<img id="urlAdress" class="draggable" src="">
				</div>			
				<img id="imgageKonstr" src="image/mujskaya_futbolka_constr.png">
			</div>
		</div>

CSS

#KonstrModul #blockColor{
	background-color: #ffffff;
}
#KonstrModul{
	width: 93%;
	border: 3px dashed #000000;
	position: relative;
	overflow: hidden;
}
#KonstrModul #imgageKonstr{
	width: 100%;
	z-index: 3;
	position: relative;
	pointer-events: none;
}

JavaScript

$("#fileForm").on("change",function(e){
						e.preventDefault();
						var fromData = new FormData($(this)[0])

						$.ajax({
							url: "unloade.php",
							type: "POST",
							data: fromData,
							dataType: "json",
							processData: false,
							contentType: false,
							success: function (data){
								$("#urlAdress").attr("src", data.url);
								alert("Отправлено"+data.url);
							}	
						});
					});
				});
				//Перещать вставленное изображение
				$(function(){
					$(".draggable").draggable();
				})