在MooTools中实现 jQuery’s hover() 方法 »
在jQuery中提供一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。它接受了两个函数，代表鼠标的mouseover 和 mouseout事件。
当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数，这两个函数正好是我们MooTools 的 fade()方法(即淡入淡出特效)。
以下就是我们 通过对 MooTools Elements 的扩展实现的.
The MooTools Javascript
1 2 3 4 5 6 7 8 9 10 11 12 13 | /* hover! */ Element.implement({ 'hover': function(fn1,fn2) { return this.addEvents({ 'mouseenter': function(e) { fn1.attempt(e,this); }, 'mouseleave': function(e) { fn2.attempt(e,this); } }) } }); |
我们扩展的hover()，它能接受两个方法; 那就是我们要求的mouseover和mouseleave事件。每个方法是对应的是相应的事件。
The Usage
1 2 3 4 5 6 | /* fade in and out on hover event */ $('hover-me').hover(function(e) { this.fade('out'); }, function(e) { this.fade('in'); }); |
演示：
