带有动画元素的 jQuery mouseleave 错误
我遇到了一个奇怪的问题。
如果鼠标移动,jQuery 1.4.1 mouseenter/mouseleave 事件会正确触发,这没什么大不了的。然而,当光标本身保持静态但元素被 animate() 移走时,它在某些浏览器中会出现错误。
因此,想象一下这样的代码:
jQuery('somelement').bind(
{
mouseenter: function(e) {
log.debug("enter");
$(this).animate({left: 9999}, 2000);
},
mouseleave: function() {
log.debug("leave");
}
});
如果将鼠标快速移动到元素上然后停止,根据浏览器的不同,您将得到不同的结果。
FF3.6、Safari 4、IE7:当光标离开动画元素时,即使鼠标本身静止不动,mouseleave也会按预期触发。
IE6、IE8、Opera 9/10、Safari 3、Chrome:即使元素位于窗口之外,mouseleave 也不会触发。需要轻微移动鼠标才能触发正确的 mouseleave 事件。
有什么想法如何修复它吗?
I have bumped into a weird issue.
jQuery 1.4.1 mouseenter/mouseleave events fire up correctly if the mouse is being moved, not a big deal. However, it bugs in some browsers when the cursor itself remains static but the element is being moved away by animate().
So imagine the code like this:
jQuery('somelement').bind(
{
mouseenter: function(e) {
log.debug("enter");
$(this).animate({left: 9999}, 2000);
},
mouseleave: function() {
log.debug("leave");
}
});
if you rapidly move the mouse onto the element and then stop it, you'll get different results depending on the browser.
FF3.6, Safari 4, IE7: mouseleave fired as expected when cursor has left the animated element, even if the mouse itself stands still.
IE6, IE8, Opera 9/10, Safari 3, Chrome: mouseleave NOT fired even when the element is outside the window. It takes a slight mouse move to trigger correct mouseleave event.
Any ideas how to fix it?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
不幸的是,看来 mouseover、mouseleave、mouseover 和 mouseout 函数都绑定到鼠标,而不是实际对象。当使用内联替代方案时也是如此:onmouseout 等。
据我所知,对于您想要做的事情来说,实际上没有一个很好的替代方案。如果这是一个绝对必要的功能,那么我将如何实现它。
希望这是有道理的。如果我今天有更多时间,我将构建一个示例小提琴,以便您可以了解它是如何工作的。
Unfortunately, it appears that the mouseover, mouseleave, mouseover, and mouseout functions are all bound to the mouse, not to the actual object. This is just as true when using the inline alternative: onmouseout, etc.
As far as I know, there isn't really a great alternative for what you are trying to do. If it's an absolutely necessary function, here's how I would go about it.
Hope that makes sense. If I find some more time today I'll build an example fiddle so you can see how it works.