изменение цвета шрифта с несколькими функциями .animate на нескольких div

Question

изменение цвета шрифта с несколькими функциями .animate на нескольких div

0

Поэтому я пытаюсь изменить цвет шрифта div, когда вы наводите курсор на другой элемент.

Я использую две функции анимации внутри зависания. Один анимат для фона 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);
});

фоновая анимация работает правильно, но текст не изменит цвет.

YeahMKD 24 сен. 2013, в 05:13

Источник

Теги:

jquery

css

jquery-animate

jquery-hover

1 ответ

Ещё вопросы

PSL · Accepted Answer · 2013-09-23T23-48-00.000Z

Если вы открыты для использования 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 он не выполняет цветную анимацию, потому что он был отделен в другом цветовом плагине.

скрипка

Мне очень нравится ваше второе решение. По какой-то причине это работает. хотя он использует jquery 2.x Большое спасибо
@YeahMKD Причина, по которой это работает, Вы должны включить плагин цвета. Смотрите ссылку в моем ответе.
О, я вижу это сейчас. Я не заметил это на левой стороне. Спасибо