0

そのため、別の要素にカーソルを合わせると、div のフォントの色を変更しようとしています。

これがフィドルです：http://jsfiddle.net/5QDYE/

ホバー内で 2 つのアニメーション関数を使用しています。1 つは背景 div のアニメーション、もう 1 つはテキスト 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);
});

背景のアニメーションは正しく機能していますが、テキストの色は変わりません。

4

1 に答える 1

1

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 では別の色のプラグイン パッケージで分離されているため、カラー アニメーションを実行できません。

フィドル

于 2013-09-24T02:44:29.747 に答える