[成都|内门弟子]CSS-何俊|2020年07月08日的日报-技能树.IT修真院

发表于： 2020-07-08 23:26:55

1 1367

今天完成的事情：

大概完成了任务1

遇到的问题：

取出3个随机数，连接颜色与按钮，资料来源：https://blog.csdn.net/willjojo/article/details/84877129

            function shine() {
                var box1 = Math.floor(Math.random() * box.length);
                var box2 = Math.floor(Math.random() * box.length);
                var box3 = Math.floor(Math.random() * box.length);
                if (box1 == box2) {
                    box1 = Math.floor(Math.random() * box.length);
                } else if (box2 == box3) {
                    box2 = Math.floor(Math.random() * box.length);
                } else if (box1 == box3) {
                    box3 = Math.floor(Math.random() * box.length);
                }
                box[box1].style.backgroundColor = 'rgb' + colors();
                box[box2].style.backgroundColor = 'rgb' + colors();
                box[box3].style.backgroundColor = 'rgb' + colors();
            }

完成随机变色

            function colors() {
                var rgb;
                var r = Math.floor(Math.random() * 256);
                var g = Math.floor(Math.random() * 256);
                var b = Math.floor(Math.random() * 256);
                rgb = '(' + r + ',' + g + ',' + b + ')';
                return rgb;
            }

以下代码随机变色原理不懂，但更简洁

function randomHexColor() { //随机生成十六进制颜色

return '#' + ('00000' + (Math.random() * 0x1000000 << 0).toString(16)).substr(-6);

}

2.完成开始按钮设置

            function start() {
                clearInterval(time);
                time = setInterval(function () {
                    for (var i = 0; i < box.length; i++) {
                        box[i].style.backgroundColor = '';
                    }
                    shine();
                }, 2000);
            }