使用Javascript生成隨機圓圈

Question

我想通過添加parallaxify（https://github.com/hwthorn/parallaxify）讓我的個人網站更具互動性。我找到了最好的地方（http://puu.sh/5IQZN.png），在一個名爲.index-hero的班級中。我需要做的是生成一些（隨機放置）圓圈，陰影爲：深藍色（＃0C76CF） - 白色（#ffffff）。我不知道如何（隨機混合）兩者以獲得淺色。另外（隨機放置圓圈）我試着看parallaxify的源代碼，並看到他們正在使用math.rand來隨機放置div中的圓圈，但一直無法成功重新創建它。對任何部分（顏色或位置）的幫助將不勝感激，非常棒！

Answer 1

您可以在隱藏的html中創建一個模板div，然後使用javascript克隆它，顯示它並隨機放置top和left值。您可以使用CSS將div的border-radius設置爲50%以使div看起來像圓圈。或者，您可以嘗試使用html5 <canvas>元素來創建圈子，而不是隨機放置它們。 Here's是一個很好的開始。