Jquery 复制效果有困难的

Jquery 复制效果有困难的,jquery,css,Jquery,Css,我的一个客户想要一个类似于creative agency主页的效果,在页面加载时,这些块在稍微不同的时间向上滚动 我对这是如何实现的感到困惑。有人能帮我解释一下吗?这是我做的一把小提琴,它就是这样的 请记住,不透明度可能与IE有一些问题 编辑:不需要setTimeout(),我只是把它放在那里,以便在运行脚本时获得一些延迟 代码: css: html: 看一看源代码?@Reeno它没有多大帮助,我不知道与什么相关的红色网站真的令人印象深刻,但有100多个创意极客在一个地方,这就是你可以做到的

我的一个客户想要一个类似于creative agency主页的效果,在页面加载时,这些块在稍微不同的时间向上滚动


我对这是如何实现的感到困惑。有人能帮我解释一下吗?

这是我做的一把小提琴,它就是这样的

请记住,不透明度可能与IE有一些问题

编辑:不需要setTimeout(),我只是把它放在那里,以便在运行脚本时获得一些延迟

代码:

css:

html:



看一看源代码?@Reeno它没有多大帮助,我不知道与什么相关的红色网站真的令人印象深刻,但有100多个创意极客在一个地方,这就是你可以做到的。sroll向上的效果似乎基于CSS转换。您需要开始挖掘CSS以对该技术进行反向工程。
var timeArray = [200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800];

setTimeout( function() {

    $('.box').each( function ()
    {
        var intVal = Math.floor((Math.random()*12));
        $(this).animate({ top: 0, opacity: 1 }, timeArray[ intVal ]);   
    });

}, 500);
.box 
{
    opacity: 0;
    height: 100px;
    width: 100px;
    position: relative;
    top: 40px;
    margin: 20px;
    border: 1px solid #333;
    float: left;
}
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>