遅延なし浮動小数点div

Question

ユーザーがコンテンツをスクロールするときに浮動小数点数を追加しようとしていますが、アニメーションの遅延はほとんどありません。浮動小数点数は浮動小数点数に達するとscrollTopが浮動小数点に達すると浮動小数点数をアニメーションする必要があります

あなたが変更することができます

var $scrollingDiv = $("#scrollingDiv"); 

$(window).scroll(function(){    
    var y = $(this).scrollTop(), 
     maxY = $('#footer').offset().top, 
     scrollHeight = $scrollingDiv.height(); 
    if(y< maxY-scrollHeight){ 
     $scrollingDiv 
     .stop() 
     .animate({"marginTop": ($(window).scrollTop()) + "px"}, "fast");   
    }  
}); 

Fiddle link

Answer 1

2つの問題：

1. DOMは通常遅いアニメーション化するためにJavaScriptを使用しました。 アニメーション機能をCSSに変更します。transform：translateY（）
2. スクロール機能以外のDOMから項目を選択すると、 が1回だけ実行されます。

var $scrollingDiv = $("#scrollingDiv"); 
 
var $footer = $('#footer'); 
 
var $window = $(window); 
 
    
 
$(window).scroll(function(){    
 
    var y = $(this).scrollTop(), 
 
     maxY = $footer.offset().top, 
 
     scrollHeight = $scrollingDiv.height(); 
 
    if(y< maxY-scrollHeight){ 
 
     $scrollingDiv   
 
     .css({"transform": "translateY(" + ($window.scrollTop()) + "px)"});   
 
    }  
 
});

see the fiddle link here