jQuery の `animate()` が `backgroundColor` で失敗するのはなぜですか?どうすれば修正できますか?

jQuery animate backgroundColor: 無効なプロパティ エラーの処理

マウスオーバーで jQuery を使用して、backgroundColor の変更をアニメーション化しようとすると、「」が発生する場合があります。構文が正しいにもかかわらず、無効なプロパティ」エラーが発生します。これは、jQuery がカラー アニメーションをネイティブに処理しないためです。

解決策: jQuery カラー プラグインの使用

この問題を解決するには、次のような jQuery カラー プラグインを利用できます。回答に記載されているとおりです。このプラグインは、jQuery のアニメーション機能を拡張して、backgroundColor などの色の変換を処理します。

プラグインを使用する利点

• 軽量で、コードベースに数キロバイトを追加するだけです
• オーバーヘッドを最小限に抑え、高処理を実現パフォーマンス
• Safari を含む主要なブラウザとの互換性

使用法

プラグインを使用するには、ページに次のコードを含めます。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-color/2.2.6/jquery.color.min.js"></script>

次に、backgroundColor を次のようにアニメーション化できます。

$(".usercontent").mouseover(function() {
    $(this).animate({
        backgroundColor: "olive"
    }, "slow");
});

カスタム縮小

プラグインの独自の縮小バージョンを作成したい場合は、JSCompress や Closure Compiler などのオンライン コンプレッサーを使用できます。結果は、回答で提供されたものと同様になるはずです。

以上がjQuery の `animate()` が `backgroundColor` で失敗するのはなぜですか?どうすれば修正できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。