Home / Programmazione / Javascript - AJAX / Generare colori random in Javascript
Mattepuffo

Generare colori random in Javascript

Generare colori random in Javascript

In un precedente articolo abbiamo visto come generare colori random usando PHP.

Oggi invece vediamo come fare la stessa cosa con Javascript, per poi colorare dinamicamente il testo di alcuni link.

Abbiamo quindi una lista con dentro dei link.

Troviamo con jQuery tutti gli elementi link della lista:

$(document).ready(function() {
       $('#my_list_ul li').each(function() {
        var $a = $(this).find('a');
        var cssColor = randomColor();
        $a.css({color: cssColor});
    });
});

In pratica con la funzione each cicliamo sulla lista e con find troviamo gli elementi link.

Per ogni ciclo usiamo la funzione randomColor per create un colore, che possiamo al link attraverso la funzione css di jQuery.

La funzione per generare colori è questa:

function randomColor() {
    var hex = '0123456789ABC'.split('');
    var color = '#';
    for (i = 0; i < 6; i++) {
        color = color + hex[Math.floor(Math.random() * 13)];
    }
    return color;
}

Costruiamo il colore mettendo il classico # prima del colore esadecimale construito con la varibile hex e le funzioni Math.floor e Math.random.

Math.floor arrotonda un numero per difetto; Math.random ritorna un numero casuale tra 0 e 1.

Direi che è tutto!!