对于div和图像的滚动效果

Question

当您向下滚动时，它具有滚动效果。就像当您向下滚动时一样，div和图像都会进入视图并产生效果。它叫什么，我该如何实现它？

编辑：视差滚动不是我要找的。向下滚动到“特色属性”部分，然后查看水平显示的3个图像。如果您在该区域滚动，则会看到图像滑动影响到该位置。我如何用div和图片做到这一点？

Answer 1

如果您的意思是褪色效果：可以通过将不透明度与图像的y值和文档的y pos连接来实现。

$(document).on('scroll', window, function(){ 
    var opacity = 0; 
    var windowTop = $(window).scrollTop(); 
    var windowHeight = $(window).height(); 
    var windowCenter = windowTop+(windowHeight/2); 
    var windowBottom = windowTop+windowHeight; 
    var imageCenter = $('#img').offset().top+($('#img').height()/2); 
    if(windowCenter < imageCenter){ 
    opacity = ((windowBottom - imageCenter) * 2)/windowHeight; 
    }else{ 
    opacity = ((windowTop - imageCenter) * 2)/-windowHeight; 
    } 
    $('#img').css('opacity',opacity); 
}); 

https://jsfiddle.net/c3fu0xnb/