-2

現在、いくつかのものを作成しており、マウス アニメーションを挿入するところにいました。最初はjQueryでやり始めたのですが、しばらくするとCSSの方がやりやすいと思いました。結局のところ、それは単なるホバー アニメーションです。

その時点で、「jQuery のホバー アニメーション ( mouseenter(); mouseleave() ) と CSS:hover を使用できます。使用方法の違いはどこにあるのでしょうか?」と疑問に思いました。

それが私の質問です。

私が思いつくことができる唯一のことは、マウスが元の状態とは異なる状態になったときに、ホバーされたアイテムが別の状態になる必要があるという状況です。「見たことがある」機能など。すなわち

Regular: opacity:80;
:hover opacity:100;
mouseleave opacity:10.

誰がこれに答えることができますか？

ありがとう！

4

4 に答える 4

2

比較的単純です。CSS では解決できないアクションを実行する必要がある場合は、JS を使用します。

そのようなアクションは次のとおりです。

  • AJAX

  • 計算

  • DOM の他の要素を完全に変更する

  • ...

このリストは永遠に続く可能性があります。

注意すべき例外の 1 つは、ブラウザーの互換性を実現したい場合 (特定の CSS プロパティがすべてのブラウザー バージョンでサポートされていない場合) は、JS を使用できることです。

于 2013-10-14T22:04:58.410 に答える
1

私は意見に基づいて閉じることに投票していますが、ホバーされたアイテムが祖先要素の兄弟、またはホバーされたアイテムの前の兄弟に変更をもたらす必要がある場合は、JavaScript が必要であることをお勧めします。

ホバーされたアイテムを一時的に別の方法で表示するだけのユースケースの場合は、CSS を使用してください (より簡単で、ブラウザーが最適化できます)。他の要素を変更または変更することが目的の場合は、JavaScript (またはそのライブラリの 1 つ) が必要です。

于 2013-10-14T22:04:13.333 に答える
1

一般に、ブラウザーが CSS を最適化できる可能性があるため、可能な限り CSS ソリューションを優先することをお勧めします。CSS が実行できない場合にのみ、JavaScript/jQuery ソリューションを使用してください (CSS ではできないことを行う必要があるため、:hover正しく処理できない IE7 などの古いブラウザーをサポートする必要があるためなど)。

于 2013-10-14T22:05:16.647 に答える
1

mouseoverおよびmouseoutjQuery で処理できる DOM マウス イベントです。jQuery には、要素のスタイルを変更できるメソッド、つまりjQuery.css(). それは明らかです。

もちろん、:hoverあなたの場合は CSS の方が効率的でシンプルです。

マウス イベントとの組み合わせはjQuery.css()、CSS と同じ動作に評価される jQuery 使用の特定のケースにすぎません:hover。正方形と同じことは、長方形の特定のケースです。

于 2013-10-14T22:07:33.980 に答える