jQuery的：CSS動畫

Question

期間設置不承認價值觀，我有以下功能：

var height = $('.fade').outerHeight(); 

function fadeIt() { 
    var fade = function() { 
     var opcty = (height - window.scrollY)/height; 

     if (opcty >= 0) { 
      console.log(opcty); 
      $('.fade').css('opacity', opcty); 
     } 
    }; 

    $(window).on('scroll', fade); 
} 

應該「地圖」一個div來滾動位置的不透明度。其實，它甚至有效！但不能與設置不透明度的CSS動畫結合使用。我相信這是因爲jQuery不能識別CSS動畫的值，但我不確定。我該如何做這項工作？ 在下面的Fiddle中，我標記了需要刪除的兩個CSS規則以查看該函數的工作原理。

Answer 1

ammm我編輯這和它的作品

.fade { 
position: fixed; 
width: 100px; 
height: 100px; 
background-color: red;} 

var height = $('.fade').outerHeight();function fadeIt() { var fade = function() { 
    var opcty = (height - window.scrollY)/height; 

    if (opcty >= 0) { 
     console.log(opcty); 
     $('.fade').css({opacity: (height - window.scrollY)/height}); 
    } 
}; 

$(window).on('scroll', fade);}fadeIt(); 

而這樣一來它的工作原理，buuutt，如果你改變的CSS來.animate並添加250時，byeee它工作得更好。