ホバーにUlタグがあり、 cssを使用して表示します。
今、私はdivタグが最初のフェードインまたはアニメーションなどの他の効果になることを望んでいます。
私はそれを使用して簡単に実行できることを知っていますが、Html5、css3、cssを使用してこれを達成できるか知りたいですdivjQuery
質問する
1140 次
4 に答える
2
私が知る限り、コードからdisplay: none;anddisplay: block;行を削除すると、アニメーションが有効になります:
http://jsfiddle.net/Cedue/31/
(これは、display: 行のみを削除した元のフィドルのコピーです。) ただし、これにより、非表示のテキストにアクセスしたり、強調表示したり、ホバーしたりすることができるという問題が発生します。その動作を望まない場合は、マージンを使用して移動するなど、正しい領域がホバリングされるまで非表示にする別の方法を検討することをお勧めします。
アナが述べたように、フェード全体をアニメーション化する場合は、トランジション パラメーターとして不透明度を使用する必要があります (例: transition: opacity 1s ease;、別のブラウザー サポート用の追加行を使用)。この例のように background をトランジション プロパティとして使用すると、背景のみがフェードし、テキストが即座に表示されます。
編集: 私自身の好奇心のために、Windows と Mac の両方で、Chrome と Firefox でこれをテストしましたdisplay。行を削除すると、それらすべてでアニメーションが機能することが確認できました。
于 2013-01-12T21:09:30.940 に答える
2
http://jsfiddle.net/thebabydino/Cedue/7/でフェードイン
-webkit-opacityのようなものはありませんでした-moz-opacity
を移行する場合はopacity、次のいずれかを記述します
transition: opacity 1s
また
transition: 1s
于 2013-01-12T13:19:22.177 に答える
0
CSS3 トランジションを調べる必要がありますhttp://www.alistapart.com/articles/understanding-css3-transitions/
于 2013-01-12T12:54:11.983 に答える