网格视差(如High Sierra页面上的苹果)

时间:2017-07-09 18:40:59

标签: javascript jquery parallax

我试图在双面网格中制作一个简单的视差效果。 在Apple的网站上,他们在High Sierra页面上使用视差效果。 (https://www.apple.com/nl/macos/high-sierra-preview/

Here is a picture of the section with the parallax effect

网格的右半部分比网格的左侧移动得慢。

我试图达到这个效果,但我遇到了几个问题:

  • Parallax Scrolling infinity:Apple的效果在某个时刻停止。
  • 网格中组件的对齐。

有人能帮助我吗?

这是我试过的......

    $(document).ready(function(){
    $(window).bind('scroll', function(e){
        parallax();
    });
    function parallax(){
        var scrolledVertical = $(window).scrollTop();
        $('.vertical').css('top','+' + ((scrolledVertical/1.3)) + 'px');
    }
    });

1 个答案:

答案 0 :(得分:0)

我也在努力寻找能够达到这种确切效果的教程。但我找不到任何东西......