javascript - 如何永久设置高亮持续时间

Question

我想永久设置 Ext.get(el).highlight() 函数的持续时间。这可能不使用 cls 吗？我已经尝试为持续时间配置赋予无穷大。但是我这样做会收到很多错误。

Answer 1

您需要重写函数highlight。有恒定的 1000ms。

Ext.dom.Element.override({
    highlight: function(color, options) {
            var me = this,
                dom = me.dom,
                from = {},
                animFly = new Ext.dom.Fly(),
                restore, to, attr, lns, event, fn;

            options = options || {};
            lns = options.listeners || {};
            attr = options.attr || 'backgroundColor';
            from[attr] = color || 'ffff9c';

            if (!options.to) {
                to = {};
                to[attr] = options.endColor || me.getColor(attr, 'ffffff', '');
            }
            else {
                to = options.to;
            }

            // Don't apply directly on lns, since we reference it in our own callbacks below
            options.listeners = Ext.apply(Ext.apply({}, lns), {
                beforeanimate: function() {
                    // Reattach to the DOM in case the caller animated a Fly
                    // in which case the dom reference will have changed by now.
                    animFly.attach(dom);

                    restore = dom.style[attr];
                    animFly.clearOpacity();
                    animFly.show();

                    event = lns.beforeanimate;

                    if (event) {
                        fn = event.fn || event;

                        return fn.apply(event.scope || lns.scope || WIN, arguments);
                    }
                },
                afteranimate: function() {
                    if (dom) {
                        dom.style[attr] = restore;
                    }

                    event = lns.afteranimate;

                    if (event) {
                        fn = event.fn || event;
                        fn.apply(event.scope || lns.scope || WIN, arguments);
                    }
                }
            });

            me.animate(Ext.apply({}, options, {
                duration: 10000, // here new duration ms
                easing: 'ease-in',
                from: from,
                to: to
            }));

            return me;
        }
});

或者您可以将配置附加到 highlight 方法，例如:

Ext.get(el).highlight("#ffff9c", {
    attr: "backgroundColor",
    endColor: "#ffffff",
    easing: 'easeIn',
    duration: 4000
});