問題タブ [css-transitions]

CSSトランジションを使用して画像ギャラリーを作成しました。CSSトランジションをmodernizrプラグインでpicekdupとして使用できない場合、デフォルトでフェードインおよびフェードアウト効果が適用されます。この効果はまったく機能していません。誰かがコードの問題を見ることができますか？CSS3バージョンは完全に機能します。

編集

Webキットの動作と同じようにaddClassとremoveClassに作り直しました。JQuery関数は、コンソールエラーなしで機能するようになりました。ただし、特に流動的ではありません。CSS-3トランジションでは、ユーザーが複数のサムネイルをクリックすると、エフェクトの途中であっても、画像は穏やかにトランジションされます。JQueryの継ぎ目が詰まり、ジャンプを開始します。

これに関するアイデア。

addClassjQueryの//関数をremoveClass介してCSSトランジションを簡単に使用できるライブラリを探しています。toggleClassつまり、これらの関数がWebkitで（CSSクラスを追加する以外に）何もしないようにしたいのですが、IEではjQueryアニメーションを使用します。jQueryUIは、これら3つの関数を置き換えて、必要なものに近づきますが、正確な要素でのみ機能します（たとえば$('#myID').addClass('foo');、アニメーション化されません#myID.foo .someClass）

私は周りを見回しましたが、これを行うものは見つかりませんでした。誰かが知っているといいのですが:)そうでない場合、解決策には次のものが必要です。

1. CSSトランジションプロパティのページ上のすべてのスタイルシートを解析する
2. すべてのスタイルシートをトランジションと一致させる（例-webkit-transition）
3. これらのスタイルシートの保存
4. onaddClassなどは現在およびツリーの下に一致します（例.addedClass .someOtherClass）
5. 一致したすべての要素（またはスタイルルール）にアニメーションを適用します

したがって、スタイルシート（それらのテキスト）を解析したり、（個々のノードではなく）ルールをアニメーション化したりするための既存のソリューションを誰かが知っている場合は、それも役立ちます。

サムネイルの上にcssを付けてホバーすると、背景のグラデーションがフェードインするようにトランジションしようとしています。トランジションは機能しませんが、rgba()値に変更するだけで問題なく機能します。グラデーションはサポートされていませんか？私も画像を使ってみましたが、画像も遷移しません。

別の投稿のように、それが可能であることは知っていますが、どれほど正確に理解することはできません。ヘルプ>使用するCSSは次のとおりです。

ルールの組み合わせを使用して、transition可能な限りクロスブラウザ互換の方法でCSS3ルールを実現しています。、、、、およびを使用していtransitionます。-webkit-transition-moz-transition-o-transition

-ms-transitionInternet Explorerのどのバージョンにも同様のプロパティがありますか？IE 6-8の不透明度に対して次のルールがどのように機能するかと同様に、古いバージョンのIE用の独自のフィルターはありますか？

CSS3でスタイリングしている比較的複雑なボタンがあります。トランジションが機能していないことを除けば、意図したとおりに表示および動作します。ホバーなどでフェードするはずですが、動作せず、mozオペラとクロームでテストされています。運がありません。

これがフィドルへのリンクですhttp://jsfiddle.net/dsyne/DpsuN/1/

どんな助けでもいただければ幸いです、私は多くの異なることを試みました。たとえば、スタックを並べ替えます。トランジションで順序が重要かどうかわかりませんか？

編集：間違ったリンク申し訳ありません

webkit-animation と @-webkit-keyframes でアニメーションを作ろうとしています。内部に子 div を含むアニメーション化された div があります。

そして、マウスが子の上にあるときに、親の webkit-animation を停止します。

例はありますか？

ありがとう

WebKit は OpenGL を使用して CSS トランジションをレンダリングしますか、それともソフトウェア レンダリングを使用しますか?

http://jsfiddle.net/nicktheandroid/PXdXr/1/

2つの異なるグラデーションの間でアニメーション化し、1つをホバーでフェードインさせます。私の例は何が起こるべきかを示していますが、それは即座に起こります、私はそれがそれらの間でフェードすることを望みます。

ここでの参考のためにSO（これはすべてjsfiddleにあります）：

したがって、次のCSSトランジションを要素にアタッチします。

特定の要素でこれらの継承された遷移を無効にする方法はありますか？

仕事をしていないようです。