ansaurus

Question

Answer 1

A:

var timer = null;
element.addEvents({
  mouseenter: function() {
    timer = setTimeout(foo, 5000);
  },

  mouseleave: function() {
    clearTimeout(timer);
  }

});

So foo will be called only if cursor was over element for 5 seconds

fantactuka 2010-09-02 20:30:32

can i work around the code become like this ? but i not sure wat to replace with the foo.. this.menu.addEvents({ mouseenter: function (event) { timer = setTimeout(foo, 5000); obj.remain = []; obj.removeRemain(10) }, mouseleave: function (event) { clearTimeout(timer); obj.remain.each(function (item) { item.addClass(obj.options.remainClass) }); obj.removeRemain(obj.options.remainTime) } });

redcoder 2010-09-02 20:58:21

`foo` is a function you what to be called in case cursor is over the element for 5 seconds

fantactuka 2010-09-03 06:31:50

Answer 2

+1 A:

Using setTimeout, it's not the MooTools way. What you should use is the framework's methods:

var theDiv = $$('div')[0];
var foo = function(){
    theDiv.highlight();
};
var timer;

theDiv.addEvents({
    mouseenter: function() {
        timer = foo.delay(1000);
    },

    mouseleave: function() {
        $clear(timer);
    }
});

See a working example: http://www.jsfiddle.net/oskar/SZsNT/

Oskar Krawczyk 2010-09-03 06:36:00

ansaurus

tags:

views:

answers:

mootool event delay on specifed timing

related questions