JSFiddle - React, Tailwind, and code Playground

by Ishank Dubey

HTML

<div id='hoverme'><span id='tt'>i am test</span>Hover Me Hover Me Hover Me</div>

CSS

div{
  width:500px;
  height:100px;
  background-color:#fff;
  position:relative;
}
div:hover #tt{
  display:inline;
}

#tt{
  display:none;
  position:absolute;
  top:0;
  left:0;
  background-color:green;
}
body{
  padding:0;
  margin:0;
}

JavaScript

document.getElementById('hoverme').addEventListener('mouseover', function (evt){
//console.log(evt);
})

document.getElementById('hoverme').addEventListener('mousemove', function (evt){
console.log(evt);
console.log(evt.target.getBoundingClientRect());
})

document.getElementById('hoverme').addEventListener('mousemout', function (evt){
console.log('out');
})