JSFiddle - React, Tailwind, and code Playground

HTML

<svg width=500px height=400px>
    <image id=img1 data-type="img1" xlink:href=/favicon.png x=10 y=10 height=20 width=20 class="img1" />
</svg>
<div id="div_legend" style="visibility:hidden; position:absolute" >demo</div>

CSS

.img{cursor:move;}

JavaScript

var svg = document.querySelector('svg');
		
	var shape = document.createElementNS("http://www.w3.org/2000/svg", "image");

	svg.appendChild(shape);
	var ddData = {
		element: null,
		initialX: 0,
		initialY: 0,
		originalX: 0,
		originalY: 0,
		finalX: 0,
		finalY: 0,
		contadorElementos: 1,
		movidos: {},
		index: 0
	};

	svg.addEventListener('mouseover', mouseover); //souris sur le object poubelle 
	function mouseover(e) {
			var div_title = document.getElementById('div_legend'); 
    if (e.target.id == "img1"){
			document.getElementById(e.target.id).setAttribute("height", "28px"); 
			document.getElementById(e.target.id).setAttribute("width", "28px");
      document.getElementById('div_legend').style.visibility="visible";
			var x = e.clientX, y = e.clientY; //souris
      document.getElementById('div_legend').style.top = y + 'px';
      document.getElementById('div_legend').style.left = x + 'px';
  		div_title.style.padding = "2px 0";
  		div_title.style.borderRadius = "7px"; //border coins div
      div_title.style.color = "#fff";
      div_title.style.backgroundColor = 'black'; 
      div_title.style.width = "100px";
      div_title.style.height = "20px"; 
  		div_title.style.textAlign = "center";
      //div_title.style.transition = "opacity 1s";
      div_title.style.boxShadow = "5px 5px 5px #aaa"; //sombre
      //div_title.style.webkitTransition = 'opacity 2s';
      div_title.style.MozTransition = 'opacity 1s';
      
    }
	};
	
  svg.addEventListener('mouseout', mouseout); 
	function mouseout(e) {
  	var div_title = document.getElementById('div_legend'); 
		if (e.target.id == "img1"){
			document.getElementById(e.target.id).setAttribute("height", "20px"); 
			document.getElementById(e.target.id).setAttribute("width", "20px");
      div_title.style.visibility="hidden";
		}
	}