1

例：

これが私が作成したHTMLの例です：http：//jsfiddle.net/Tgjnp/2/

質問：

CSS：

a {
    color: #bbb;
    text-decoration: none;
    margin-right: 2em;
    font-weight: bold;            
}

.green {
    color: green;                        
}

この例では、セットclassはを取得するfade animationため、指定された色はでフェードインおよびフェードアウトしmouse hoverます。それ以外の場合は、デフォルトの色に戻す必要があります。

問題は、ホバーカラーをフェードインおよびフェードアウトさせる方法です。

4

2 に答える 2

0

プレーンなjQueryでは色をアニメーション化できません。そのためには、ある種のプラグイン、つまりjQuery UI（これは巨大です）またはColorアニメーションプラグインを使用する必要があります

または、いくつかの単純なCSS3トランジションを使用できます-DEMO

これは、新しいブラウザではうまく機能しますが、古いIEでは機能しません。

a {
    color: #bbb;
    text-decoration: none;
    margin-right: 2em;
    font-weight: bold;

    -webkit-transition: color .5s linear;   
       -moz-transition: color .5s linear; 
            transition: color .5s linear;    
}
于 2012-12-15T22:52:13.953 に答える
0

ここに素晴らしい説明があります。派手なCSS3の魔法は使用せず、JQueryのみを使用します。終了色と開始色を追加するだけで、JQueryが遷移をアニメーション化します。

于 2012-12-15T22:56:47.957 に答える