纯原生,不使用jQuery
鼠标移入元素后出发 onmouseover 当动画执行完毕之后再判断当前鼠标位置是
否在元素内或外,若在外则执行 onmouseout 若在元素内则不做任何处理。
<div id= "itemTitle" class="itemTitle">
<span class="topline"></span>
<p></p>
<span class="bottomline"></span>
</div>
假设上方这样一个结构,
window.onload = function(){
itemTitle = document.getElementById("itemTitle");
topline = document.querySelector(".topline");
bottomline = document.querySelector(".bottomline");
itemTitle.addEventListener("mouseover",titAnimat);
itemTitle.addEventListener("transitionend",mouseOut);
}
function mouseOut(){
itemTitle.addEventListener("mouseout",titInit);
}
**想要的结果**:当鼠标移入时触发mouseover,直到动画结束后,再判断当前鼠标位置。
该如何实现?