Question

我在使服务器端生成的代码（<php ?>）div淡入淡出时遇到问题。

我查询数据库并返回我放在div中的六行。通常，由于mysql查询中的while子句，div将被复制六次。这里的问题是我希望六个div在不同的时间淡入和淡出。只要六个动态生成的div在不同时间随机淡入，无论哪个先崩溃都没关系。

我知道这将是jquery或javascript，我是新手。

Answer 1

类似的东西：

function fadeRandom($divI) { // make a function we can re-use
    window.setTimeout(function() { // do this next stuff after a short break
        $divI.fadeIn(100, function(){ // fade $divI in, then ...
            $divI.fadeOut(100, function() { // fade $divI out, then ...
                fadeRandom($divI); // start the whole cycle over
            }
        }, Math.random(100) * 100); // do that after 1-100ms
    });
}
for (var i = 0; i++; i < 6) { // go through all 6 divs and ...
    fadeRandom($('#div_' + i)); // get the fade cycle started
}

应该有效。这是未经测试的代码，你可能想要调整数字，但希望它能给你一个基本的想法。

Answer 2

你很可能需要使用一些不同的Javascript来完成你想要的......

如果您有六个元素，那么您可以使用.random()函数来获取要交换的下一个元素...示例为HERE.

jQuery有一些内置方法可以淡入/淡出元素...

HERE for .fadeIn()

HERE for .fadeOut()

对于计时器，您可以使用.doTimeout()演示HERE.这是一个jQuery插件。 Javascript确实有一个内置计时器setInterval()，但使用.doTimeout()将允许您保持我喜欢的相同javascript外观。

使多个随机div以不同的时序淡入淡出

2 个答案: