调用一个类来在鼠标进入时停止/暂停幻灯片播放

Call a class to stop/pause slideshow on mouseenter

本文关键字:播放 幻灯片 暂停 鼠标 一个 调用      更新时间:2023-09-26

我正在给这个Mootools幻灯片添加一些新代码。

我添加了缩略图和鼠标悬停功能,可以滚动缩略图。
现在我需要让计时器在幻灯片停止/暂停时,mouseenter。我试着用下面的代码,但得到了一个Uncaught TypeError: Object #<HTMLDivElement> has no method '_stopClock'

spinAreaDiv.addEvent('mouseenter', function(){
this._stopClock();  
})

如何调用_stopClock

var Spin = new Class({
...
...
_stopClock:function(){
    if(!this.options.timer) { 
        return false; 
    } else {
        this.timerRunning = false;
        clearInterval(this.clock);
        this.timer.pause.addClass('active');
    }
},
...

这是一个绑定问题。当dom事件的事件回调触发时,这将是元素。

element.addEvent('something', function(){
    this === element; // true;
});
// save a reference
var self = this;
element.addEvent('something', function(){
    this === element; // true;
    self._stockClock(); // works.
});
// or. use Function.prototype.bind
element.addEvent('something', function(){
    this !== element; // true;
    this._stopClock(); // works.
}.bind(this));
// or even...
this.element.addEvent('something', this._stopClock.bind(this)); // works.