Newer
Older
2021-fuga / kadai7.js
var box1 = document.getElementById('box1');
var box2 = document.getElementById('box2');
var box3 = document.getElementById('box3');
var box4 = document.getElementById('box4');
var box5 = document.getElementById('box5');
var box6 = document.getElementById('box6');
var box7 = document.getElementById('box7');
var box8 = document.getElementById('box8');
var box9 = document.getElementById('box9');
var box10 = document.getElementById('box10');
var box11 = document.getElementById('box11');
var box12 = document.getElementById('box12');
var box13 = document.getElementById('box13');
var box14 = document.getElementById('box14');
var box15 = document.getElementById('box15');
var box16 = document.getElementById('box16');
var box17 = document.getElementById('box17');
var box18 = document.getElementById('box18');
var box19 = document.getElementById('box19');
var box20 = document.getElementById('box20');
var box21 = document.getElementById('box21');
var box22 = document.getElementById('box22');
var box23 = document.getElementById('box23');
var box24 = document.getElementById('box24');
var box25 = document.getElementById('box25');

function first_gray(target1){
if(target1.style.background == 'skyblue') {
    target1.style.background = 'gray';
} else{
target1.style.background = 'skyblue';
}}

function first_blue(target2){
  if(target2.style.background == 'gray') {
      target2.style.background = 'skyblue';
  } else{
  target2.style.background = 'gray';
}}

box1.addEventListener('click',function(){
  first_blue(box1);
  first_blue(box2);
  first_blue(box6);
});

box2.addEventListener('click',function(){
  first_blue(box1);
  first_blue(box2);
  first_blue(box3);
  first_blue(box7);
});

box3.addEventListener('click',function(){
  first_blue(box2);
  first_blue(box3);
  first_blue(box4);
  first_blue(box8);
});

box4.addEventListener('click',function(){
  first_blue(box3);
  first_blue(box4);
  first_blue(box5);
  first_blue(box9);
});

box5.addEventListener('click',function(){
  first_blue(box4);
  first_blue(box5);
  first_blue(box10);
});

box6.addEventListener('click',function(){
  first_blue(box1);
  first_blue(box6);
  first_blue(box7);
  first_blue(box11);
});

box7.addEventListener('click',function(){
  first_blue(box2);
  first_blue(box6);
  first_blue(box7);
  first_blue(box8);
  first_blue(box12);
});

box8.addEventListener('click',function(){
  first_blue(box3);
  first_blue(box7);
  first_blue(box8);
  first_blue(box9);
  first_gray(box13);
});

box9.addEventListener('click',function(){
  first_blue(box4);
  first_blue(box8);
  first_blue(box9);
  first_blue(box10);
  first_blue(box14);
});

box10.addEventListener('click',function(){
  first_blue(box5);
  first_blue(box9);
  first_blue(box10);
  first_blue(box15);
});

box11.addEventListener('click',function(){
  first_blue(box6);
  first_blue(box11);
  first_blue(box12);
  first_blue(box16);
});

box12.addEventListener('click',function(){
  first_blue(box7);
  first_blue(box11);
  first_blue(box12);
  first_gray(box13);
  first_blue(box17);
});

box13.addEventListener('click',function(){
  first_blue(box8);
  first_blue(box12);
  first_gray(box13);
  first_blue(box14);
  first_blue(box18);
});

box14.addEventListener('click',function(){
  first_blue(box9);
  first_gray(box13);
  first_blue(box14);
  first_blue(box15);
  first_blue(box19);
});

box15.addEventListener('click',function(){
  first_blue(box10);
  first_blue(box14);
  first_blue(box15);
  first_blue(box20);
});

box16.addEventListener('click',function(){
  first_blue(box11);
  first_blue(box16);
  first_blue(box17);
  first_blue(box21);
});

box17.addEventListener('click',function(){
  first_blue(box12);
  first_blue(box16);
  first_blue(box17);
  first_blue(box18);
  first_blue(box22);
});

box18.addEventListener('click',function(){
  first_gray(box13);
  first_blue(box17);
  first_blue(box18);
  first_blue(box19);
  first_blue(box23);
});

box19.addEventListener('click',function(){
  first_blue(box14);
  first_blue(box18);
  first_blue(box19);
  first_blue(box20);
  first_blue(box24);
});

box20.addEventListener('click',function(){
  first_blue(box15);
  first_blue(box19);
  first_blue(box20);
  first_blue(box25);
});

box21.addEventListener('click',function(){
  first_blue(box16);
  first_blue(box21);
  first_blue(box22);
});

box22.addEventListener('click',function(){
  first_blue(box17);
  first_blue(box21);
  first_blue(box22);
  first_blue(box23);
});


box23.addEventListener('click',function(){
  first_blue(box18);
  first_blue(box22);
  first_blue(box23);
  first_blue(box24);
});

box24.addEventListener('click',function(){
  first_blue(box19);
  first_blue(box23);
  first_blue(box24);
  first_blue(box25);
});

box25.addEventListener('click',function(){
  first_blue(box20);
  first_blue(box24);
  first_blue(box25);
});