Question

我正在制作一个动画背景，用于生成div元素的网页，看起来像气泡并激活它们的透明度。我希望气泡只能在屏幕的左侧400px和右侧400px内生成。我可以让它们在中间生成，但是当我尝试使它在边缘生成时会破坏代码。（也许是无限循环？）

formatter()

Answer 1

为什么不简单地将副本随机化？这样您就不必检查和丢弃潜在的位置。这样的事情。

function randomBetween(min,max) {
    return Math.floor(Math.random()*(max-min+1)+min);
}

var width = $(window).width();
var leftPixels = Math.round(Math.random()) ? randomBetween(0, 400) :
                 randomBetween(width - 400, width);

这里发生的是它首先随机生成0或1，然后如果它是1则生成LEFT边值，如果0生成右边值。没有额外的迭代会减慢你的程序。

Answer 2

我复制了您的bubble effect并且最终没有中断代码！

我认为你缺少的是，如果绝对定位的气泡从右边定位，你需要给它一个right CSS偏移值;同样，对于左侧绝对定位的气泡，请坚持left属性：

var rightOffset = $(window).width() - 400; //where i want them on the right
do {
  var rightPx = Math.floor(Math.random() * $(window).width() - 100);
} while (rightPx >= 400 || rightOffset <= rightPx);

/*
* ...
*/
$('html').append("<div class='bubble' style=' right: " + rightPx + "px; top: " + topPx + "px;'></div>");

如何使用jquery使我的div在任何一方的400 px内生成？

2 个答案: