jQueryのscrollTopスプライト（）高精度、高速

Question

（ピクセル損失を避けるため）ページをスクロールしたとき、私は要素の不透明度を変更するjQueryのscrollTopスプライト（）の値を使用していますページスクロールの

$(document).on('scroll', function(){ 
    if($(document).scrollTop() >= 1){ 
     $('#elem').css({'opacity': ($(document).scrollTop() * 0.02)}); 
    } 
}); 

それが正常に動作しますが、問題があればということです私はページをすばやくスクロールして、多くのピクセルをスキップします。その結果、返されるピクセルは私はゆっくりスクロールするときのよう

0 
30 
50 
80 
90 
... 

なく

0 
1 
2 
3 
4 

...また

私はスムーズに値を必要と同じ問題を持っていた別の時間が、複雑、この「間引き」動作もの...

どうすればこの問題を解決できますか？

Answer 1

スムーズにしたい場合は、要素にCSSトランジションを追加する必要があります。したがって、スクロールが0から500にジャンプしても、遷移はスムーズなままです。

#elem { 
    -webkit-transition: opacity 0.5s ease; 
    -moz-transition: opacity 0.5s ease; 
    transition: opacity 0.5s ease; 
} 

jQueryでスムーズなピクセル値を達成しようとすると動作しません。