0

私はウェブサイトを設計していますが、効果のために、アニメーションでテキストの色を変更するための以下の一連の jquery コードに出くわしました。しかし、うまくいかず、何が悪いのかわかりません。

JSFIDDLE

以下は、現在問題が発生しているコードです。

jQuery:

$('.list-5 li a').hover(function() {
    $(this).stop().animate({ color: '#fff' })
}, function() {
    $(this).stop().animate({ color: '#0e1b23' })
})

HTML:

  <div class="list-5">
    <ul>
     <li>
       <a href="#">Hello world</a> 
     </li>
    </ul>
  </div>
4

3 に答える 3

7

#FFFF無効な色です。#FFFまたはを使用します#FFFFFF。

また、デフォルトのjQuery.animateは色をアニメーション化しません。そのためにはjQueryUI（またはColorプラグイン）を使用する必要があります。

于 2012-07-02T16:17:26.973 に答える
2

色をアニメーション化することはできません! 

.animate({
        color: '#ffff'
    });

jQuery UI への参照を追加しない限り。

以下に示す場合を除き、すべてのアニメーション化されたプロパティは単一の数値にアニメーション化する必要があります。数値でないほとんどのプロパティは、基本的な jQuery 機能を使用してアニメーション化できません (たとえば、幅、高さ、または左はアニメーション化できますが、jQuery.Color() プラグインを使用しない限り、背景色はアニメーション化できません)。

jQuery UI を使用した動作デモ

于 2012-07-02T16:19:03.283 に答える
1

色をアニメーション化するには、jQuery UI または jQuery プラグインを使用する必要があります。また、間違ったカラー コードを使用しています。#fffまたはを使用して#ffffffください。

アニメイトより:

たとえば、jQuery.Color() プラグインを使用しない限り、幅、高さ、または左をアニメーション化できますが、背景色をアニメーション化することはできません。

注: jQuery UI プロジェクトは、色などの数値以外のスタイルをアニメーション化できるようにすることで、.animate() メソッドを拡張します。このプロジェクトには、個々の属性ではなく、CSS クラスを介してアニメーションを指定するためのメカニズムも含まれています。

于 2012-07-02T16:19:15.320 に答える