createEvent

by trentHarlem

HTML

<button onclick="mouseSim(event)">Simulate Mouse Over</button>

<br>

<div id='myDiv'></div>

CSS

#myDiv {
  background-color: green;
  height: 150px;
  width: 325px;
  transition: all ease-in-out 2s;
}
#myDiv:hover {
  height: fit-content;
  width: 100%;
}

JavaScript

const button = document.querySelector('button')
button.addEventListener('click', mouseSim(), false)

function mouseSim(event) {
  let x = document.createEvent("MouseEvent");
  x.initMouseEvent("mouseover", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

 myDiv.dispatchEvent(x);
}