jQuery: поменять подсветку на цвет?

Question

Возможно ли изменить цвет, на который эффект выделения jQuery исчезает?

Прямо сейчас он начинает выделение с желтого, затем становится белым, а затем исчезает.

В конечном итоге я хочу выделить цвет фона желтым, а затем просто сделать его прозрачным.

Answer 1

Я только что столкнулся с таким поведением в jQuery UI 1.8.9, похоже, это ошибка.

Обходной путь для меня заключался в том, чтобы определить цвет фона элемента, который я выделил в CSS, вместо того, чтобы оставить его по умолчанию прозрачным.

Если цвет фона не установлен (т. Е. Он прозрачный), при условии, что вы не изменили цвет подсветки, тогда элемент будет переходить в желтый, затем в белый, а затем исчезать.

Однако, если вы установите цвет фона подсвечиваемого элемента, он будет бледнеть до желтого, а затем до исходного цвета элемента при его выделении.

Answer 2

$("#id").effect( "highlight",{color:'#FFFF00',easing:'easeInElastic'},4000 );

В объекте параметров эффекта вы можете изменить свойство цвета по умолчанию на любое другое. Мой элемент не настроен на цвет, он выделяется ярко-желтым цветом, а затем исчезает. Я использую jQuery 1.8.1 и jQuery-UI.

Answer 3

Используйте плагин jQuery Color: https://github.com/jquery/jquery-color

С его помощью вы можете выделить элемент и вернуться к прозрачному.

Answer 4

Ниже приведен исходный код эффекта подсветки в jQuery UI 1.8.9.Не похоже, что он должен переходить в белый цвет ... он должен переходить из желтого (# ffff99 или передаваемый параметр цвета) в исходный цвет фона, который кэшируется в переменной animation.Вы используете 1.8.9?

/*
 * jQuery UI Effects Highlight 1.8.9
 *
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Effects/Highlight
 *
 * Depends:
 *  jquery.effects.core.js
 */
(function( $, undefined ) {

$.effects.highlight = function(o) {
    return this.queue(function() {
        var elem = $(this),
            props = ['backgroundImage', 'backgroundColor', 'opacity'],
            mode = $.effects.setMode(elem, o.options.mode || 'show'),
            animation = {
                backgroundColor: elem.css('backgroundColor')
            };

        if (mode == 'hide') {
            animation.opacity = 0;
        }

        $.effects.save(elem, props);
        elem
            .show()
            .css({
                backgroundImage: 'none',
                backgroundColor: o.options.color || '#ffff99'
            })
            .animate(animation, {
                queue: false,
                duration: o.duration,
                easing: o.options.easing,
                complete: function() {
                    (mode == 'hide' && elem.hide());
                    $.effects.restore(elem, props);
                    (mode == 'show' && !$.support.opacity && this.style.removeAttribute('filter'));
                    (o.callback && o.callback.apply(this, arguments));
                    elem.dequeue();
                }
            });
    });
};