Здравствуйте.
Есть массив с цветами:
var colorsArray = (['#1fa8d0', '#6ad01f', '#d01f3c'] );
Есть заголовок h2. Нужно сделать так, чтобы при наведении курсора на заголовок его цвет менялся по кругу, на цвета из массива по очереди. Плавно перетекал. Сделал это вот так:
$('.wrap h2').mouseover(
function ()
{
colorAni($(this), 1000)
}
);
function colorAni(el, interval)
{
var colorsArray = (['#1fa8d0', '#6ad01f', '#d01f3c'] );
i = 0;
while (i < colorsArray.length) {
col = colorsArray[i]
el.animate(
{
color: col
}, interval )
i++
}
setInterval(colorAni(el, interval), interval * colorsArray.length)
}
Но возникла проблема. Как при отведении курсора остановить смену цвета? Как я понял остановить функцию в onmouseover не получится...