Javascript 如何在ace编辑器中设置选择/取消选择动画？

我正在为ApacheIgnite开发实时配置工具。 UI分为两列。在左列中，我有各种输入、复选框、下拉列表。。。在右边的列中，我有一个ace编辑器，我在其中显示生成的配置的预览

我想通过在ace edit中选择更改的零件来实现对这些零件的选择。 我已经这么做了。但是为了更好的用户体验，我想选择带有淡入/淡出动画的更改线条

谁能给我一些建议如何实施这一点

选择代码： editor.selection.addRange（新范围（开始、0、结束、0））

我想我需要一些如何调整CSS

或者我应该在循环中更改选择颜色，并在短时间内使用不同的颜色进行多次选择

更新：挖掘ace几个小时后，我发现ace忽略了css的动画部分。所以我开始，用10个步骤配置渐变，并在css中创建10种样式。并在循环中应用它们以获得范围。这里是我的代码（我使用AngularJS，所以它是我控制器的一部分）：

---

我从一位Ace开发者“夜翼”那里得到了一个答案：

使用css动画或转换将是最好的解决方案，但目前还不起作用，因为标记层使用innerHTML删除所有重新启动动画的标记节点。

---

作为一种解决方法，可以将带有动画的dom节点添加到editor.container中，并使用类似的代码将它们放置在编辑器中

我从一位Ace开发人员“nightwing”那里得到了一个答案：

使用css动画或转换将是最好的解决方案，但目前还不起作用，因为标记层使用innerHTML删除所有重新启动动画的标记节点。 作为一种解决方法，可以将带有动画的dom节点添加到editor.container中，并使用类似的代码将它们放置在编辑器中

var animation = {editor: null, stage: 0, start: 0, stop: 0};

function _clearSelection(editor) {
    _.forEach(editor.session.getMarkers(false), function (marker) {
        editor.session.removeMarker(marker.id);
    });
}

function _animate() {
    animation.stage = animation.stage + 1;

    animation.editor.session.addMarker(new Range(animation.start, 0, animation.stop, 0),
        'preview-highlight-' + animation.stage, 'line', false);
}

function _fade(editor, start, stop) {
    var promise = editor.animatePromise;

    if (promise) {
        $interval.cancel(promise);

        _clearSelection(editor);
    }

    animation = {editor: editor, stage: 0, start: start, stop: stop};

    editor.animatePromise = $interval(_animate, 100, 10, false);
}