jQuery滚动

Question

我希望在“设计20个年轻人”部分的页面下方创建类似于this one的效果。 效果本质上是获取一个长图像来改变设备（如MacBook或iPhone）中的css顶部值，因此看起来设备中的图像也在用户滚动网站时滚动。

我已经创建了一个fiddle来显示我已经有多远，但这在调整大小或最初加载时效果不佳。

这是我在下面使用的一些代码

var yOffset =  $element.offset().top - ($(document).scrollTop() + $(window).height()/diviser)

感谢任何帮助。

Answer 1

好的，我现在就看到了。但运动是如此微妙，我甚至没有注意到它。对于那些几乎无法察觉的事情来说，这看起来很多。看来他根据整个窗口滚动的一些百分比变化来改变图像的顶部位置，但仅当图像在视口内时才会改变。

就在我的头顶（完全未经测试），像这样的东西会向上滚动图像，窗口滚动速度的1/4;

var mobiletop = $('.mobile').position().top;
var scrollfactor = 4;

$(window).scroll(function(){
    if($(window).scrollTop() > mobiletop){
        var imgtop = $('.mobile img').position().top -  (($(window).scrollTop() - mobiletop)/scrollfactor);

        $('.mobile img').css('top', imgtop + 'px');
}