javascript - 在 TimelineJS 中实现回调

Question

在 TimelineJS我想实现一个回调，每次幻灯片(中间的主面板)发生变化时都会触发该回调，无论该更改是通过单击侧面的“右”或“左”按钮发生的，还是通过单击底部时间面板中的时间线。除了 Issue 82 中对它的引用之外，我找不到有关此类回调的任何信息。从一年前开始。

关于如何开始的建议？ (换句话说，我什至不知道从哪里开始)。

Answer 1

Timeline JS 每当更新时都会触发一个事件，代码在最新版本的第 5274 行:

function upDate() {
    config.current_slide = current_slide;
    VMM.fireEvent(layout, "UPDATE");
};

fireEvent 的代码是:

VMM.fireEvent = function(element, the_event_type, the_data) {
    var e;
    var _event_type = "click";
    var _data = [];

    if (the_event_type != null && the_event_type != "") {
        _event_type = the_event_type;
    }
    if (the_data != null && the_data != "") {
        _data = the_data;
    }

    if( typeof( jQuery ) != 'undefined' ){
        jQuery(element).trigger(_event_type, _data);

        //return e;
    }

};

然后重要的部分是:

jQuery(element).trigger(_event_type, _data);

所以，您需要做的就是弄清楚元素布局是什么，所以我会暂时将 upDate 函数编辑为:

function upDate() {
    console.log($(layout).attr('id') + ' : ' + $(layout).attr('class'));
    config.current_slide = current_slide;
    VMM.fireEvent(layout, "UPDATE");
};

并查看它记录的元素的类/ID 的内容。然后，假设它返回的类是“时间轴”，例如，您可以编写如下内容:

$('.timeline').on("UPDATE", function() {
    your_function_that_does_whatever_you_need();
});