все работает
<!DOCTYPE HTML>
<html>
<head>
<style>
.d{
width:200px;
height:200px;
border:3px solid black;
}
</style>
</head>
<body>
<a href='#' id='create'>create</a>
<script>
function _(selector) {
return document.querySelectorAll(selector)[0];
}
_('#create').onclick = createElement;
function createElement(){
var div = document.createElement('div');
div.className='d';
document.body.appendChild(div);
hover({
elem:div,
over:function (){
alert('over');
},
out:function () {
alert('out');
}
})
return false;
};
function hover (opt) {
opt.elem.onmouseover = ElemMouseAction;
opt.elem.onmouseout = ElemMouseAction;
function ElemMouseAction (evt) {
var related, Call;
var e = evt || event;
if(e.type == 'mouseover'){
Call = opt.over;
related = e.relatedTarget || e.fromElement;
} else {
Call = opt.out;
related = e.relatedTarget || e.toElement;
}
while (related && related != this) {
related = related.parentNode;
}
if(related == this) return;
Call();
}
}
</script>
</body>
</html>