2

ランダムな 16 進セレクターを選択する方法はありますが、特定の色に対してのみですか?

次の画像を再作成しようとしていますが、実際にはコーディングしています。

画像

これまでのところ、次のコードを管理しています。

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 );

どんな助けでも大歓迎 です

4

2 に答える 2

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);
        });

クラス赤の各ピクセルをループし、ランダムな背景色を構築します。

ランダムな値と範囲をいじって、目的の結果を得ることができます。;)

于 2012-07-03T14:52:31.110 に答える
0

これを使用して、配列内の文字列の一部を削除して、必要な色のみを返すようにすることができます：http: //paulirish.com/2009/random-hex-color-code-snippets/

于 2012-07-03T14:40:17.327 に答える