Как сделать случайный цвет у div?

Question

[AlexFo90]

Здравствуйте, подскажите как реализовать JavaScript-м генерацию случайного цвета. Дело в том что при клике на кнопку появляется div и он должен всегда быть разного (случайного) цвета! как такое можно реализовать?
спасибо.

Answer 1

[Сергей Соколов]

'#' + (Math.random().toString(16) + '000000').substring(2,8).toUpperCase()

Comments

[smogstart]

Зачем добавлять '000000'?

Answer 2

[Stimulate]

jsfiddle.net/os0rLctq

Comments

[AlexFo90]

Спасибо круто!!! А со случайным размером то же примерно?

[Stimulate]

AlexFo90, да jsfiddle.net/os0rLctq/1

[AlexFo90]

Спасибо, вы гений!!!

Answer 3

[Михаил Лялин]

1. с просторов интернета
{
col = Math.round(255.0*Math.random());
r = col.toString(16);
col = Math.round(255.0*Math.random());
g=col.toString(16);
col = Math.round(255.0*Math.random());
d=col.toString(16);
col=r+g+d;
return col;
}

2. случайный цвет = зло для посетителей

Comments

[Vicz1]

То ли я молодец, то ли лыжи не едут.. Зачем каждый раз пересоздавать col? Мб легче было бы прописать все функции в р, г, б? Если ошиблась в терминах, поправьте, пожалуйста

Answer 4

[Игорь Васильев]

Я думаю, что случайный цвет, это зло, потому как есть люди которым не нравятся определённые цвета, и первое впечатление будет с отвращением и не приязнью. Поэтому советую почитать эту статью https://medium.com/webbdev/%D1%81%D1%80%D0%B5%D0%B... здесь описывается как брать средний цвет картинки, и на его основе делать цвет самого блока. Выглядит весьма интересно и красиво.

Comments

[abasiuk]

интересная статья)

Answer 5

[abasiuk]

function getRandomInt(max) {
  return Math.floor(Math.random() * Math.floor(max));
}

var red = getRandomInt(255);
var green = getRandomInt(255);
var blue = getRandomInt(255);

$(".div").css("backgroundColor", "rgb(" + red + "," + green + "," + blue + ")" );

Answer 6

[cs_gamers2014]

var box = document.createElement('div');

box.style.backgroundColor = `rgb(${getRandom(0, 255)}, ${getRandom(0, 255)}, ${getRandom(0, 255)})`;

function getRandom(min, max){
  return Math.ceil(Math.random() * (max - min) + min))
}