Mam 9 bloków na stronę, chciałem zmienić swój kolor tła losowo, używając takiej samej klasy (czy można użyć jednej klasy?) I powinien być inny kolor BG na blok.

Na przykład:

block1 = red
block2 = yellow
block3 = green

I tak dalej..

Próbowałem tego kodu: (który jest drukowany w tym samym czasie)

var colors = ["#99B3FF", "#799979", "#1E1E1E"],
selectedColor = colors[Math.floor(Math.random() * colors.length)];

header = $(".recent-posts-body");
header.css("background-color", selectedColor);

Nie jestem pewien, jak wdrożyć to za pomocą JS.

1
user3176382 28 listopad 2013, 15:34

3 odpowiedzi

Najlepsza odpowiedź

Będziesz musiał iterować każdego bloku i przypisać kolory:

var colors = ["#99B3FF", "#799979", "#1E1E1E"],
header = $(".recent-posts-body");
$.each( head, function(idx, obj) {
    selectedColor = colors[Math.floor(Math.random()*colors.length)];
    obj.css("background-color", selectedColor);
});

Powyższy kod nie zagwarantuje, że każdy blok ma inny kolor z poprzedniego bloku, ale kolory są losowo wybrane z tablicy.

2
hjpotter92 28 listopad 2013, 11:39

Spójrz tutaj: http://jsfiddle.net/5xust/2/

KOD

var colors = ["#99B3FF", "#799979", "#1E1E1E", "#AAA", "#FFF", "#CCC"];

var blocks = $(".block");
for(var x = 0; x < blocks.length; x++){
    var random = Math.floor(Math.random() * colors.length);
    var selectedColor = colors[random];
    $(blocks[x]).css("background-color", selectedColor ).html(selectedColor);
    colors.splice(random, 1);
}

Za każdym razem, gdy div dostaje kolor tła, kolor ten jest usuwany z początku, więc ten sam kolor nie pojawi się ponownie. Mam nadzieję, że to pomoże

1
BeNdErR 28 listopad 2013, 12:04
var colors = ["#99B3FF", "#799979", "#1E1E1E"];

$("your elements").each(function()
{
   $(this).css('background-color', colors[Math.floor(Math.random()*colors.length)]);
});

I skrzypce: http://jsfiddle.net/eithe/ly2fq/

0
eithed 28 listopad 2013, 11:39