Как мне анимировать цвет фона на прозрачный в jQuery?

Question

Я могу анимировать от прозрачного до цветного, но когда я говорю jquery анимировать backgroundColor: 'transparent', он просто меняется на белый. Есть идеи как это исправить?

Answer 1

Использовать фон вместо backgroundColor:

$('#myDiv').animate({background: "transparent"});

Answer 2

Мое решение состояло в том, чтобы анимировать цвет, видимый пользователем (то есть цвет родительского элемента), а затем установить исходный цвет (который может быть или не быть «прозрачным») после завершения анимации

var $t = $(some selector);

var seenColour = findColour($t, 'background-color');
var origColour = $t.css('background-color');
$t.css('background-color', '#ffff99');
$t.animate(
    {backgroundColor: seenColour}, 
    4000, 
    function(){ $t.css('background-color', origColour)}
);

function findColour($elem, colourAttr)
{
    var colour = $elem.css(colourAttr);
    if (colour === 'transparent')
    {
        var $parent = $elem.parent();
        if ($parent)
        {
            return findColour($parent, colourAttr);
        }
        // Default to white
        return '#FFFFFF'; 
    }
    return colour;
}