2011-02-01 19 views
2

私は、CSSの:ホバー疑似クラスを使用して、ホバーのドロップダウンを制御したいと考えています。それは達成されました。しかし、トリッキーな部分は、そのドロップダウンをアニメーション化しています。私はではないメニューを表示するためにjQueryに依存したい、それは完全に(フェードアニメーションなしで)JSオフと動作するはずです。 JSがオンになっている場合、CSSの「フック」をホバーして代わりにいくつかのjQueryを実行する(メニューをフェードインし、ホバーアウトする)ことができますか?CSS疑似クラスとjQueryアニメーション?

答えて

5

利用可能になったときのCSSホバーを抑制することを忘れない - そうCSSそして、JSのホバーは...同時に

を実行して、あなたのjqueryのを追加する文句を言わないでホバリング: $('ul.js-hovers').hover(function() { ... etc - see Darko Z's answer

+0

@zach - これはまさに私が考えていたものです。 – jlmakes

+0

ニース!それを考えなければならないが、それは非常に効果的でリーンな解決策である。ありがとう! – Gavin

0

これはかなり簡単にjQueryで達成できます。ただ、このドキュメントを見て:http://api.jquery.com/hover/

はちょうどあなたがjqueryの$('ul').removeClass('css-hovers').addClass('js-hovers'); で、その後<ul class="css-hovers">

を持っていると言う、JS/jQueryのは非常に大まか

+0

しかし、私は完全に.hover()を認識していますが、CSSホバーを抑制する方法を正確に把握する必要があります。 – Gavin

0

Superfish jQuery pluginを見ると、標準的なsuckerfish CSSメニューシステムに魅力的なアニメーションとhoverIntentサポートが追加されているだけです。それをドロップしたり、他のものに移動したり、ソースがどのように動作するかを調べたりできます。

関連する問題