Плавное появление css градиента(Jquery)

[ZvEr_HaCkEr]

Так как я в js ни бум-бум, обращаюсь за помощью к профессионалам форума. В общем, есть меню, в котором при наведении на соответствующий пункт появляется выделяющий css градиент. Собственно вопрос:как можно сделать его плавное появление? Спасибо за помощь)
P.S пробовал сделать с помощью css, да код рабит только в мозиле

-moz-transition:0.5s all;
-webkit-transition:0.5s all;
-o-transition:0.5s all;
transition:0.5s all;

P.P.S
вот пример

.Menu li{
	background-color: #ffffff;
	background-image: -webkit-gradient(linear,left top, left bottom,from(#ffffff), color-stop(0.5,#ff0000), color-stop(0.51, #000000));
	position:relative;
	float: left;
	list-style: none;
}
.Menu li:hover{
	background-image: -webkit-gradient(linear,left top, left bottom,from(#ffffff), color-stop(0.5,#00ff00), color-stop(0.51, #000000));
}

[Виталий Желтяков]

Если не ошибаюсь, то плавный переход градиента сделать нельзя.

Цветовые анимации делаются на jQuery при помощи плагина color.

[ZvEr_HaCkEr]

Спасибо за информацию! Может стоит попробовать сделать картинками или поискать ошибки, которые влияют на работу transition?

[Виталий Желтяков]

С картинками тоже легко не сделаете.

Можно наложить два блока друг на друга и менять прозрачность одного из них при наведении при помощи тригеров. Кстати, для градиентов этот способ тоже будет работать. Но сами понимаете возни и багов уйма.

[SkyM@n]

Все сделать можно. jQuery Colors вам в руки

[ZvEr_HaCkEr]

Посмотрел плагин, и обнаружил там следующую строку

'backgroundColor', 'borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor', 'color', 'outlineColor'

а у меня градиент задается атрибутом background-image. Как здесь быть?

[ZvEr_HaCkEr]

Никто не поможет?

[SkyM@n]

1. Делаете градиент.
2. Меняете opacity

[Alexei91]

Как альтернатива - посмотрите
http://tigir.com/fade.htm - пошаговое описание создания плавного перехода цвета/градиента.