Created
February 1, 2018 07:24
-
-
Save choopi24/4bdb7ecd76b4ba3eac5aea2007d0dbfe to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <script> | |
| alert("Welcome"); | |
| //var Buttons = document.getElementsByTagName("button"); | |
| //for (var i = 0; i < buttons.length; i++) { | |
| // alert(buttons[i].id); | |
| //} | |
| var Turn = 2; | |
| //function funrun() { | |
| //alert("Welcome"); | |
| //var x = document.getElementsByClassName("st"); | |
| // x[0].innerHTML = "Hello"; | |
| // document.getElementsByClassName('st')[0].id = "Right"; | |
| // var y = document.getElementById("Right").id; | |
| // window.alert(document.getElementById(y)); | |
| //} | |
| // | |
| //function MyTurn(){ | |
| var x , y; | |
| function Play(x, y){ | |
| switch (x){ | |
| case 1:{ | |
| switch (y){ | |
| //case 1-1 | |
| case 1: | |
| if(document.getElementById("1r-1c").className == 'button-color'){break;} | |
| if(document.getElementById("1r-1c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("1r-1c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("1r-1c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 1-2 | |
| case 2: | |
| if(document.getElementById("1r-2c").className == 'button-color'){break;} | |
| if(document.getElementById("1r-2c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("1r-2c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("1r-2c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 1-3 | |
| case 3: | |
| if(document.getElementById("1r-3c").className == 'button-color'){break;} | |
| if(document.getElementById("1r-3c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("1r-3c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("1r-3c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 1-4 | |
| case 4: | |
| if(document.getElementById("1r-4c").className == 'button-color'){break;} | |
| if(document.getElementById("1r-4c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("1r-4c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("1r-4c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 1-5 | |
| case 5: | |
| if(document.getElementById("1r-5c").className == 'button-color'){break;} | |
| if(document.getElementById("1r-5c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("1r-5c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("1r-5c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 1-6 | |
| case 6: | |
| if(document.getElementById("1r-6c").className == 'button-color'){break;} | |
| if(document.getElementById("1r-6c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("1r-6c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("1r-6c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 1-7 | |
| case 7: | |
| if(document.getElementById("1r-7c").className == 'button-color'){break;} | |
| if(document.getElementById("1r-7c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("1r-7c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("1r-7c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| default: | |
| alert("Error"); | |
| } | |
| } | |
| break; | |
| case 2:{ | |
| switch (y){ | |
| //case 2-1 | |
| case 1: | |
| if(document.getElementById("2r-1c").className == 'button-color'){break;} | |
| if(document.getElementById("2r-1c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("2r-1c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("2r-1c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 2-2 | |
| case 2: | |
| if(document.getElementById("2r-2c").className == 'button-color'){break;} | |
| if(document.getElementById("2r-2c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("2r-2c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("2r-2c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 2-3 | |
| case 3: | |
| if(document.getElementById("2r-3c").className == 'button-color'){break;} | |
| if(document.getElementById("2r-3c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("2r-3c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("2r-3c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 2-4 | |
| case 4: | |
| if(document.getElementById("2r-4c").className == 'button-color'){break;} | |
| if(document.getElementById("2r-4c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("2r-4c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("2r-4c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 2-5 | |
| case 5: | |
| if(document.getElementById("2r-5c").className == 'button-color'){break;} | |
| if(document.getElementById("2r-5c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("2r-5c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("2r-5c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 2-6 | |
| case 6: | |
| if(document.getElementById("2r-6c").className == 'button-color'){break;} | |
| if(document.getElementById("2r-6c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("2r-6c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("2r-6c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 2-7 | |
| case 7: | |
| if(document.getElementById("2r-7c").className == 'button-color'){break;} | |
| if(document.getElementById("2r-7c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("2r-7c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("2r-7c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| default: | |
| alert("Error"); | |
| } | |
| } | |
| break; | |
| case 3:{ | |
| switch (y){ | |
| //case 3-1 | |
| case 1: | |
| if(document.getElementById("3r-1c").className == 'button-color'){break;} | |
| if(document.getElementById("3r-1c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("3r-1c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("3r-1c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 3-2 | |
| case 2: | |
| if(document.getElementById("3r-2c").className == 'button-color'){break;} | |
| if(document.getElementById("3r-2c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("3r-2c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("3r-2c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 3-3 | |
| case 3: | |
| if(document.getElementById("3r-3c").className == 'button-color'){break;} | |
| if(document.getElementById("3r-3c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("3r-3c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("3r-3c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 3-4 | |
| case 4: | |
| if(document.getElementById("3r-4c").className == 'button-color'){break;} | |
| if(document.getElementById("3r-4c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("3r-4c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("3r-4c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 3-5 | |
| case 5: | |
| if(document.getElementById("3r-5c").className == 'button-color'){break;} | |
| if(document.getElementById("3r-5c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("3r-5c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("3r-5c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 3-6 | |
| case 6: | |
| if(document.getElementById("3r-6c").className == 'button-color'){break;} | |
| if(document.getElementById("3r-6c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("3r-6c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("3r-6c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 3-7 | |
| case 7: | |
| if(document.getElementById("3r-7c").className == 'button-color'){break;} | |
| if(document.getElementById("3r-7c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("3r-7c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("3r-7c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| default: | |
| alert("Error"); | |
| } | |
| } | |
| break; | |
| case 4:{ | |
| switch (y){ | |
| //case 4-1 | |
| case 1: | |
| if(document.getElementById("4r-1c").className == 'button-color'){break;} | |
| if(document.getElementById("4r-1c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("4r-1c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("4r-1c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 4-2 | |
| case 2: | |
| if(document.getElementById("4r-2c").className == 'button-color'){break;} | |
| if(document.getElementById("4r-2c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("4r-2c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("4r-2c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 4-3 | |
| case 3: | |
| if(document.getElementById("4r-3c").className == 'button-color'){break;} | |
| if(document.getElementById("4r-3c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("4r-3c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("4r-3c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 4-4 | |
| case 4: | |
| if(document.getElementById("4r-4c").className == 'button-color'){break;} | |
| if(document.getElementById("4r-4c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("4r-4c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("4r-4c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 4-5 | |
| case 5: | |
| if(document.getElementById("4r-5c").className == 'button-color'){break;} | |
| if(document.getElementById("4r-5c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("4r-5c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("4r-5c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 4-6 | |
| case 6: | |
| if(document.getElementById("4r-6c").className == 'button-color'){break;} | |
| if(document.getElementById("4r-6c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("4r-6c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("4r-6c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 4-7 | |
| case 7: | |
| if(document.getElementById("4r-7c").className == 'button-color'){break;} | |
| if(document.getElementById("4r-7c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("4r-7c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("4r-7c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| default: | |
| alert("Error"); | |
| } | |
| } | |
| break; | |
| case 5:{ | |
| switch (y){ | |
| //case 5-1 | |
| case 1: | |
| if(document.getElementById("5r-1c").className == 'button-color'){break;} | |
| if(document.getElementById("5r-1c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("5r-1c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("5r-1c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 5-2 | |
| case 2: | |
| if(document.getElementById("5r-2c").className == 'button-color'){break;} | |
| if(document.getElementById("5r-2c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("5r-2c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("5r-2c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 5-3 | |
| case 3: | |
| if(document.getElementById("5r-3c").className == 'button-color'){break;} | |
| if(document.getElementById("5r-3c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("5r-3c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("5r-3c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 5-4 | |
| case 4: | |
| if(document.getElementById("5r-4c").className == 'button-color'){break;} | |
| if(document.getElementById("5r-4c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("5r-4c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("5r-4c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 5-5 | |
| case 5: | |
| if(document.getElementById("5r-5c").className == 'button-color'){break;} | |
| if(document.getElementById("5r-5c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("5r-5c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("5r-5c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 5-6 | |
| case 6: | |
| if(document.getElementById("5r-6c").className == 'button-color'){break;} | |
| if(document.getElementById("5r-6c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("5r-6c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("5r-6c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 5-7 | |
| case 7: | |
| if(document.getElementById("5r-7c").className == 'button-color'){break;} | |
| if(document.getElementById("5r-7c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("5r-7c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("5r-7c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| default: | |
| alert("Error"); | |
| } | |
| } | |
| break; | |
| case 6:{ | |
| switch (y){ | |
| //case 6-1 | |
| case 1: | |
| if(document.getElementById("6r-1c").className == 'button-color'){break;} | |
| if(document.getElementById("6r-1c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("6r-1c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("6r-1c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 6-2 | |
| case 2: | |
| if(document.getElementById("2r-2c").className == 'button-color'){break;} | |
| if(document.getElementById("6r-2c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("6r-2c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("6r-2c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 6-3 | |
| case 3: | |
| if(document.getElementById("6r-3c").className == 'button-color'){break;} | |
| if(document.getElementById("6r-3c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("6r-3c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("6r-3c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 6-4 | |
| case 4: | |
| if(document.getElementById("6r-4c").className == 'button-color'){break;} | |
| if(document.getElementById("6r-4c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("6r-4c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("6r-4c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 6-5 | |
| case 5: | |
| if(document.getElementById("6r-5c").className == 'button-color'){break;} | |
| if(document.getElementById("6r-5c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("6r-5c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("6r-5c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 6-6 | |
| case 6: | |
| if(document.getElementById("6r-6c").className == 'button-color'){break;} | |
| if(document.getElementById("6r-6c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("6r-6c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("6r-6c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| //case 6-7 | |
| case 7: | |
| if(document.getElementById("6r-7c").className == 'button-color'){break;} | |
| if(document.getElementById("6r-7c").className == 'button_color'){break;} | |
| if (Turn%2 == 0){ | |
| document.getElementById("6r-7c").className = 'button-color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| else{ | |
| document.getElementById("6r-7c").className = 'button_color'; | |
| Turn = Turn + 1; | |
| break; | |
| } | |
| default: | |
| alert("Error"); | |
| } | |
| } | |
| break; | |
| default: | |
| alert("Error1"); | |
| } | |
| } | |
| //document.getElementById().className = 'button-color'; | |
| </script> | |
| <style> | |
| body{ | |
| background-color: aquamarine; | |
| } | |
| button{ | |
| border:1px solid black; | |
| display:block; | |
| background-color: beige; | |
| padding: 25px; | |
| width: 25px; | |
| height: 25px; | |
| position: absolute; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <form> | |
| Enter Your Name: <input type="text"> </input> | |
| <input type="submit"> </input> | |
| </form> | |
| <br><br><br><br><hr> | |
| <!-- 1st row --> | |
| <button type="button" id="1r-1c" class="st" style="top:155;left:600;" onclick="Play(1,1)"> </button> | |
| <button type="button" id="1r-2c" class="st" style="top:155;left:680;" onclick="Play(1,2)"> </button> | |
| <button type="button" id="1r-3c" class="st" style="top:155;left:760;" onclick="Play(1,3)"> </button> | |
| <button type="button" id="1r-4c" class="st" style="top:155;left:840;" onclick="Play(1,4)"> </button> | |
| <button type="button" id="1r-5c" class="st" style="top:155;left:920;" onclick="Play(1,5)"> </button> | |
| <button type="button" id="1r-6c" class="st" style="top:155;left:1000;" onclick="Play(1,6)"> </button> | |
| <button type="button" id="1r-7c" class="st" style="top:155;left:1080;" onclick="Play(1,7)"> </button> | |
| <!-- 2nd row --> | |
| <button type="button" id="2r-1c" class="st" style="top:235;left:600;" onclick="Play(2,1)"> </button> | |
| <button type="button" id="2r-2c" class="st" style="top:235;left:680;" onclick="Play(2,2)"> </button> | |
| <button type="button" id="2r-3c" class="st" style="top:235;left:760;" onclick="Play(2,3)"> </button> | |
| <button type="button" id="2r-4c" class="st" style="top:235;left:840;" onclick="Play(2,4)"> </button> | |
| <button type="button" id="2r-5c" class="st" style="top:235;left:920;" onclick="Play(2,5)"> </button> | |
| <button type="button" id="2r-6c" class="st" style="top:235;left:1000;" onclick="Play(2,6)"> </button> | |
| <button type="button" id="2r-7c" class="st" style="top:235;left:1080;" onclick="Play(2,7)"> </button> | |
| <!-- 3rd row --> | |
| <button type="button" id="3r-1c" class="st" style="top:315;left:600;" onclick="Play(3,1)"> </button> | |
| <button type="button" id="3r-2c" class="st" style="top:315;left:680;" onclick="Play(3,2)"> </button> | |
| <button type="button" id="3r-3c" class="st" style="top:315;left:760;" onclick="Play(3,3)"> </button> | |
| <button type="button" id="3r-4c" class="st" style="top:315;left:840;" onclick="Play(3,4)"> </button> | |
| <button type="button" id="3r-5c" class="st" style="top:315;left:920;" onclick="Play(3,5)"> </button> | |
| <button type="button" id="3r-6c" class="st" style="top:315;left:1000;" onclick="Play(3,6)"> </button> | |
| <button type="button" id="3r-7c" class="st" style="top:315;left:1080;" onclick="Play(3,7)"> </button> | |
| <!-- 4th row --> | |
| <button type="button" id="4r-1c" class="st" style="top:395;left:600;" onclick="Play(4,1)"> </button> | |
| <button type="button" id="4r-2c" class="st" style="top:395;left:680;" onclick="Play(4,2)"> </button> | |
| <button type="button" id="4r-3c" class="st" style="top:395;left:760;" onclick="Play(4,3)"> </button> | |
| <button type="button" id="4r-4c" class="st" style="top:395;left:840;" onclick="Play(4,4)"> </button> | |
| <button type="button" id="4r-5c" class="st" style="top:395;left:920;" onclick="Play(4,5)"> </button> | |
| <button type="button" id="4r-6c" class="st" style="top:395;left:1000;" onclick="Play(4,6)"> </button> | |
| <button type="button" id="4r-7c" class="st" style="top:395;left:1080;" onclick="Play(4,7)"> </button> | |
| <!-- 5th row --> | |
| <button type="button" id="5r-1c" class="st" style="top:475;left:600;" onclick="Play(5,1)"> </button> | |
| <button type="button" id="5r-2c" class="st" style="top:475;left:680;" onclick="Play(5,2)"> </button> | |
| <button type="button" id="5r-3c" class="st" style="top:475;left:760;" onclick="Play(5,3)"> </button> | |
| <button type="button" id="5r-4c" class="st" style="top:475;left:840;" onclick="Play(5,4)"> </button> | |
| <button type="button" id="5r-5c" class="st" style="top:475;left:920;" onclick="Play(5,5)"> </button> | |
| <button type="button" id="5r-6c" class="st" style="top:475;left:1000;" onclick="Play(5,6)"> </button> | |
| <button type="button" id="5r-7c" class="st" style="top:475;left:1080;" onclick="Play(5,7)"> </button> | |
| <!-- 6th row --> | |
| <button type="button" id="6r-1c" class="st" style="top:555;left:600;" onclick="Play(6,1)"> </button> | |
| <button type="button" id="6r-2c" class="st" style="top:555;left:680;" onclick="Play(6,2)"> </button> | |
| <button type="button" id="6r-3c" class="st" style="top:555;left:760;" onclick="Play(6,3)"> </button> | |
| <button type="button" id="6r-4c" class="st" style="top:555;left:840;" onclick="Play(6,4)"> </button> | |
| <button type="button" id="6r-5c" class="st" style="top:555;left:920;" onclick="Play(6,5)"> </button> | |
| <button type="button" id="6r-6c" class="st" style="top:555;left:1000;" onclick="Play(6,6)"> </button> | |
| <button type="button" id="6r-7c" class="st" style="top:555;left:1080;" onclick="Play(6,7)"> </button> | |
| <style> | |
| button.button-color { | |
| background-color:red; | |
| border:1px solid black; | |
| padding: 25px; | |
| width: 25px; | |
| height: 25px; | |
| position: absolute; | |
| } | |
| button.button_color { | |
| background-color:black; | |
| border:1px solid black; | |
| padding: 25px; | |
| width: 25px; | |
| height: 25px; | |
| position: absolute; | |
| } | |
| </style> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment