Question

为了保持小而简单，当点击一个按钮时，所有的div应该随机向下滑动，并且应该显示另一组新的div。

jQuery代码的基本演示：

$(document).ready(function() {
        $("#toggle_value").click(function(){
           $("#div1").show("fast");
           $("#div2").show("fast");
           $("#div3").show("fast");
        });
});

但它的全部是关于随机化效果。任何解决方案？

Answer 1

我会做这样的事情：

http://jsfiddle.net/8uKt3/13/

 $(document).ready(function() {
        var $div = $('div'),
            pos = [0, 0, 0, 500, 250, 100, 50, -500, -750, -1000, -1500], // Define your numbers
            mypos1,
            mypos2,
            $me;

        $("#toggle_value").click(function(){
            $div.each(function(){
                $me = $(this);

                // Choose a value from each array randomly
                mypos1 = pos[Math.floor(Math.random() * pos.length)];
                mypos2 = pos[Math.floor(Math.random() * pos.length)];

                // animate in a random direction in a random quantitya
                $me.animate({
                    'top' : mypos1,
                    'left': mypos2
                });
            });
        });
    });

Answer 2

你可以做这样的事情，假设你有3个可能的案例来说明div可能会如何滑落：

var rand = Math.random();
if (rand < .33) {
    // Some animation
} else if (rand < .66) {
    // Some other possible animation
} else {
    // Final animation possibility
}

Answer 3

算法：

创建一个'n'ints数组
洗牌阵列
：
- 对于混洗数组中的每个值'v'：
  - $（'＃div'+ v）.show（'fast'）

我的猜测是你会在动画中引入一个延迟，使用完成所有回“效果”使这看起来不错，但这应该是微不足道的

随机化对jQuery的影响

3 个答案: