html - Send mouse event to element via javascript -

so have element behind another, it's still visible(its covered partially element itself, otherwise covered margin attribute of element above). want trigger mouse event when mouse over, doesn't passed because of element in front. know how calculate if on , how point it, don't know how send event onmouseover or hover or onmouseout.

if helps pointing @ using document.getelementbyid("<calculated id>"). know works because it's id based off of location within grid, have calculate position of mouse , relate grid.

also event supposed happen(but isn't because of things in front of it), :hover triggers simple transition animation via css.

document.getelementbyid('elementinfront').addeventlistener('mouseenter', function(){     document.getelementbyid('elementbehind').doyourstuff(); });