检测鼠标是否使用Prototype.js触摸元素？

我正在尝试制作一个Javascript应用程序，其中一个元素将在鼠标触摸它时逐渐淡出，并在鼠标离开元素时淡入。我正在使用Scriptaculous的Prototype，那么是否有Prototype函数可以告诉我鼠标在任何给定时间是否正在接触对象？检测鼠标是否使用Prototype.js触摸元素？

我使用Scriptaculous FadeOut/FadeIn效果的主要问题是，当一个在另一个完成之后被触发时，效果会冲突并且元素会出现异常。

来源

2012-01-30 Ben Visness

只是在一些地方保存效果对象（例如在闭合），当要应用不同的效果

var element = $("element"), 
    currentEffect = null; 

element.observe("mouseenter", function() { 
    if (currentEffect) { 
     currentEffect.cancel(); 
    } 
    currentEffect = new Effect.Fade(element); 
}); 

element.observe("mouseleave", function() { 
    if (currentEffect) { 
     currentEffect.cancel(); 
    } 
    currentEffect = new Effect.Appear(element); 
});

jsfiddle demo

（很明显，你可以重构以多种方式取消，但基本上所有你需要做的就是观察mouseenter和mouseleave事件，并且记得在开始新事件之前取消任何运行效果）

来源

2012-01-30 01:28:13 Flambino

在Opera中，如果你一直保持悬停直到它100％消失，你的mouseleave，它变得可见而没有任何淡入效果。 – ajax333221 2012-01-30 02:12:24

@ ajax333221必须是Opera特定的错误。没有看到Chrome，Safari或Firefox。我没有Opera的方便，坦率地说，我不能打扰调试它。尽管如此，代码依然有效，浏览器问题仍然存在。感谢您的提醒，但 – Flambino 2012-01-30 02:27:40

也许Opera错误发生是因为您在完成后取消效果？你可以添加'afterFinish' [回调]（http://madrobby.github.com/scriptaculous/core-effects/）来清除'currentEffect'变量，因此避免这种行为。 – clockworkgeek 2012-01-30 12:48:58

检测鼠标是否使用Prototype.js触摸元素？

回答

相关问题