javascript - 覆盖的最佳方式

Question

有没有办法选择随机的十六进制选择器，但只适用于某些颜色？

我正在尝试重新创建以下图像，但实际上是对其进行编码。

图片

到目前为止，我已经管理了以下代码。

HTML

<div id="group">
<div class="sub red panel">

</div><!--sub-->
<div class="sub orange">

</div><!--sub-->
<div class="sub yellow">

</div><!--sub-->

CSS

body{
    background:#333;
}
#group{
    position:relative;
    float:left;
    width:500px;
   height:300px;
}
.sub{position:relative; float:left; width:96px;}

.pxl{width:7px; position:relative;float:left; height:7px; margin:1px 1px 0 0;}
.red div{background:#f00;}
.orange div{background:#f26607;}
.yellow div{background:#f5e70b;}

js

var pageLimit=288;

 for(var i = 1; i <= pageLimit; i++) {
  $('.sub').append('<div class="pxl"></div>' )
 }

var randint = function ( ceiling ) {
    return Math.floor( Math.random() * ceiling );
};

setTimeout(function () {
    $( '.pxl' ).each(function () {
        $( this ).delay( randint(5000) ).fadeTo( randint(10000), 0 );
    });
}, 5000 );

非常感谢任何帮助 jsFiddle

Answer 1

你可以尝试这样的事情：

活生生的例子

http://jsfiddle.net/GHsBn/8/

片段示例

var col;
    $('.red .pxl').each(function(i, e) {
            col = 'rgb(255,' + (Math.floor(Math.random() * 150)) + ',' + (Math.floor(Math.random() * 150)) + ')';
            $(e).css('background', col);
        });

它循环遍历红色类中的每个像素，并构建随机背景颜色。

您可以使用随机值和范围来获得所需的结果。;)

Answer 2

您可以使用它并删除数组中的一些字符串，以便它只返回您想要的颜色：http: //paulirish.com/2009/random-hex-color-code-snippets/