css - CSS 不透明度アニメーションを遅くする

Question

.opacity CSS プロパティでアニメーションのタイミングを遅くしたい。のように、0.2 ミリ秒またはそのようなものを遅延させたいです。

より良いアイデアを得るために、私のサイトの注目の投稿にホバーすると不透明度が追加されます: http://www.thetechnodaily.com

覚えておいてください：私はこれでjQueryを使用していません。その純粋な CSS。

Answer 1

あなたが探しているように見えるのはCSS Transitionsです。

トランジションでは、遅延とトランジションの長さを設定できます。

Answer 2

これはあなたが達成しようとしているものかもしれないと思いますか？

http://fiddle.jshell.net/9VB72/2/

より詳しい情報

Answer 3

jqueryの使用

$('#clickme').click(function() {
   $('#book').animate({
       opacity: 0.25,
       left: '+=50',
       height: 'toggle'
   }, 5000, function() {
     // Animation complete.
   });
});

http://api.jquery.com/animate/

cssを使用すると、次のようなことを試すことができます。

.class:hover {
    opacity: 1; 
    -moz-transition: all 0.4s ease-out;  /* FF4+ */
    -o-transition: all 0.4s ease-out;  /* Opera 10.5+ */
    -webkit-transition: all 0.4s ease-out;  /* Saf3.2+, Chrome */
    -ms-transition: all 0.4s ease-out;  /* IE10? */
    transition: all 0.4s ease-out;  
}