ansaurus

Question

Javascript css class based on random number

Answer 1

A:

Read your code again:

if(rand == 1 && one < 7)
...
else if(rand == 2 && two < 7)

Once you roll a red more than six times, or a blue more than six times, your code just does nothing for that square, this is why you end up with white squares.

Try something like this:

if((rand == 1 && one <= 6) || two > 6)
...
else

Tobias Cohen 2010-01-01 08:56:57

alright this solved the white square problems. However, sometimes I don't get exactly 6 red and 6 blue.

Raptrex 2010-01-01 09:10:39

Answer 2

+2 A:

Let me offer you a slightly different approach. Represent the board as an array of 12 integers.

Fill the first half of this array with one's and the second half with two's.
Shuffle the array

Loop through the array and update the DOM elements by converting the array index to the corresponding row and column in the matrix

// initialize the array
var board = [1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2];


// shuffle the array
for(var j, x, i = board.length; i; j = parseInt(Math.random() * i), 
    x = board[--i], board[i] = board[j], board[j] = x);


// At this stage one's and two's will be randomly distributed
var row = -1;
for (var i = 0; i < board.length; i++) {
    var class = board[i] == 1 ? 'one' : 'two';
    var col = i % 4;
    if (col == 0) row++;
    var box = document.getElementById('a' + col + '_' + row);
    if (box != null) {
        box.setAttribute('class', class);
        box.innerHTML = 1 + Math.floor(Math.random() * 5);
    }
}

Darin Dimitrov 2010-01-01 09:06:16

Thanks, that works

Raptrex 2010-01-01 09:16:00

ansaurus

tags:

views:

answers:

Javascript css class based on random number

related questions