javascriptを使って色をランダムで出す
javascriptを使って、ボタンをクリックするごとに背景をランダムで出すデモ。
jQuey無しで動きます。改良してグラデ版も作ってみたいです。
See the Pen 180530_色をランダムで出す by nekuta (@nekuta) on CodePen.
js
var box = document.getElementById('box');
var txt = document.getElementById('txt');
var btn = document.getElementById('btn');
var min = 0;
var max = 255;
//イベント処理
btn.addEventListener('click', colorPicker, false);
function colorPicker() {
var i = 0;
//空の配列を作成
var colorArray = [];
//whileで3回回す
//空の配列colorArrayに値を入れていく
while (i < 3) {
// 0~255までの乱数を出す
var num = Math.floor(Math.random() * (max + 1 - min)) + min;
colorArray.push(num);
i++;
}
txt.textContent = 'rgb(' + colorArray + ')'
box.style.background = 'rgb(' + colorArray + ')';
}