1

タイトルがそれ自体を説明しているかどうかはわかりませんが、おそらくそうではありません!

とにかく、50 の div があり、背景色を白から濃い黄色に設定したいと思います。最初の div は白で、最後の div は濃い黄色になります。

白の RGB 値は 255、255、255 濃い黄色の RGB 値は 227、151、4

javascript (jQuery) でそれを行うにはどうすればよいので、各 div を反復処理して徐々に暗くしますか?

これがスクリーンショット ここに画像の説明を入力 です どうもありがとう

4

3 に答える 3

3 
var divs = $('div'),
    len = divs.length;

var targ_R = 227,
    targ_G = 151,
    targ_B = 4,

    inc_R = (255 - targ_R) / len,
    inc_G = (255 - targ_G) / len,
    inc_B = (255 - targ_B) / len;

divs.css("backgroundColor", function(i, curr) {
    return "#" + toHex(255 - (i * inc_R)) +
                 toHex(255 - (i * inc_G)) +
                 toHex(255 - (i * inc_B));
});

function toHex(n) {
    var h = (~~n).toString(16);
    if (h.length < 2)
        h = "0" + h;
    return h;
}

デモ：http： //jsfiddle.net/RSyCM/

于 2012-08-14T16:47:51.083 に答える
2

これを試してください-デモ

var r, g, b;

for (var i = 0, count = $("div").length; i < count; i++) {
    r = 255 - i * 3;
    g = 255 - i * 10;
    b = 255 - i * 25;

    $("div").eq(i).css("background", "rgb(" + r + ", " + g + ", " + b + ")");
}

アップデート

最後のものを作るためにrgb(227, 151, 4)-デモ

于 2012-08-14T16:39:09.290 に答える
0

ライブラリを使用して解析とブレンディングを処理する場合に備えて、 pusher.color ライブラリを使用した Zoltan Toth の回答のバリエーションを次に示します。

デモ

var color0 = pusher.color('white');
var color1 = pusher.color('rgb', 227, 151, 4);

for (var i = 0, count = $("div").length; i < count; i++) {
    var amount = i / (count-1);
    var result = color0.blend(color1, amount);
    $("div").eq(i).css("background", result.html());
}

</p>

于 2012-08-14T21:30:58.693 に答える