CSS3を使用して画像のホバーでフェードインしますか？

Question

イメージ上にアンハーブされたクラスを全く記述することが可能かどうか疑問に思っていましたか？

私が達成しようとしているのは、誰かがフェードインする画像の上を移動したときに、移動した後にフェードアウトするときです。

Heres私のコードは、誰かが画像の上を飛んできたときにフェードインされましたが、私が引き伸ばしてもフェードアウトする必要があります。

http://jsfiddle.net/L7XCD/

Answer 1

これはあなたのために働く必要があります！ http://jsfiddle.net/L7XCD/1/

のは、これを説明するために偉大なmozillaのドキュメントを使用してみましょう：

Transition rovide a way to control the speed of animation changes to CSS properties. Instead of having the animation changes take effect instantly, you can transition the property changes over a specified time period.

また、我々は、遷移タイミング機能（やすさ、線形を使用し、簡単で、簡単にアウト、簡単-IN-アウト）

Timing functions determine how intermediate values of the transition are calculated. The timing function can be specified by providing the graph of the corresponding function, as defined by four points defining a cubic bezier

CCSマークアップは：

img { 
    opacity: 0.6; 
    transition: opacity 1s ease-in-out; 
    -moz-transition: opacity 1s ease-in-out; 
    -webkit-transition: opacity 1s ease-in-out; 
} 
img:hover { 
    opacity: 1.0; 
    transition: opacity .55s ease-in-out; 
    -moz-transition: opacity .55s ease-in-out; 
    -webkit-transition: opacity .55s ease-in-out; 
}​ 

彼は移行しやすさ・イン・アウトを使用していたので、私は同じ遷移関数を使用する方が良いと思いました。

詳細については、documentation here

はそれが役に立てば幸いチェック！

Answer 2

http://jsfiddle.net/L7XCD/2/ ちょうどそれは:)を働いホバータグ