Поэтому я пытаюсь изменить цвет шрифта div, когда вы наводите курсор на другой элемент.
Вот скрипка: http://jsfiddle.net/5QDYE/
Я использую две функции анимации внутри зависания. Один анимат для фона div, другой для текстового div. Это выглядит примерно так.
function () {
$('#background').animate({
height: "40px",
width: "80px",
marginTop: "0px",
marginLeft: "0px"
}, 500);
$("#text").animate({ color: "#FFF" }, 500);
}, function () {
$('#background').animate({
height: "0px",
width: "0px",
marginTop: "20px",
marginLeft: "40px"
}, 500);
$("#text").animate({ color: "#000" }, 500);
});
фоновая анимация работает правильно, но текст не изменит цвет.
Если вы открыты для использования css3, попробуйте.
function () {
$('#background').animate({
height: "40px",
width: "80px",
marginTop: "0px",
marginLeft: "0px"
}, 500);
$("#text").css({ 'color': "#FFF", 'transition' : 'color 1s' });
}, function () {
$('#background').animate({
height: "0px",
width: "0px",
marginTop: "20px",
marginLeft: "40px"
}, 500);
$("#text").css({ 'color': "#000", 'transition' : 'color 1s' });
});
Кажется, что анимация работает в jquery ui меньшей версии, т.е. 1.9.1 и 1.9.2. но в 2.x он не выполняет цветную анимацию, потому что он был отделен в другом цветовом плагине.