Skip to content

Abayomi complete challange #33

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
UniqueBay wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Abayomi complete challange #33

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
96 changes: 96 additions & 0 deletions chessboard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Chessboard Challenge</title>
<style>
body {
background-color: black;
color: #fff;
text-align: center;
margin: 20px;
padding: 30px;
}
strong,
li {
color: chocolate;
}
li,
h3 {
font-size: 20px;
}
</style>
</head>
<body>
<h1>
This is a Challenge to display a grid in a Chessboard-like pattern. Using
<strong>#</strong>
</h1>
<h3>To view result kindly do the following</h3>
<li>
<ul>
Right Click on the page
</ul>
<ul>
Click the inspect option (A sidebar or taskbar will pop up on any side
of your browser depending on the default position)
</ul>
<ul>
The popped up box has a navbar of it own, Listed Elements, Console,
Sources, Network, etc..
</ul>
<ul>
Click on the Console option to view result. Note: Result displayed is in
size you input.
</ul>
</li>

<script>
// Take the users desired height size
var height = prompt(`Input your range in number to display(height)`);

// Convert user input into number
height = Number(height);

// Check if input is a valid number.
while (Number.isNaN(height)) {
height = prompt("Number not valid \nEnter valid Number");
}

// Take the users desired breath size
var breath = prompt(`Input your range in number to display(breath)`);

// Convert user input into number
breath = Number(breath);

// Check if input is a valid number.
while (Number.isNaN(breath)) {
breath = prompt("Number not valid \nEnter valid Number");
}

// Declared an empty string
board = "";

// A loop to set rows (height)
for (var i = 1; i <= height; i++) {
// A loop to set the numbers of character/colum(breath)
for (var j = 1; j <= breath; j++) {
// To check if the height is divisible by 2.
if (i % 2 === 0) {
// To print "# " for even rows eight times.
board += "# ";
// To print " #" for odd rows eight times.
} else {
board += " #";
}
}
// Add a newline character to separate rows ater every 8 charater.
board += "\n";
}

console.log(board);
</script>
</body>
</html>
89 changes: 89 additions & 0 deletions fizzbuzz.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>FizzBuzz</title>
<style>
body {
background-color: black;
color: #fff;
text-align: center;
margin: 20px;
padding: 30px;
/* justify-content: center; */
}
strong,
li {
color: chocolate;
}
li,
h3 {
font-size: 20px;
}
</style>
</head>
<body>
<h1>
This is a challenge that prints out
<strong>Fizz</strong>
for numbers divisible by 3,
<strong>Buzz</strong>
for numbers divisible by 5 and
<strong>FizzBuzz</strong>
for numbers divisible by both 3 and 5.!
</h1>
<h3>To view result kindly do the following</h3>
<li>
<ul>
Right Click on the page
</ul>
<ul>
Click the inspect option (A sidebar or taskbar will pop up on any side
of your browser depending on the default position)
</ul>
<ul>
The popped up box has a navbar of it own, Listed Elements, Console,
Sources, Network, etc..
</ul>
<ul>
Click on the Console option to view result. Note: Result displayed is in
range you input.
</ul>
</li>
<script>
// Get user input
var range = prompt(`Input your range of number to check`);

// Convert user input into number
range = Number(range);

// Check if input is a valid number.
while (Number.isNaN(range)) {
range = prompt("Number not valid \nEnter valid Number");
}

// To loop through the number range inputted
for (var i = 1; i <= range; i++) {
// To check if a number is divisible by both 3 and 5 (15).
if (i % 15 == 0) {
// To print FizzBuzz if true
console.log("FizzBuzz");

// To check if a number is divisible by 3.
} else if (i % 3 == 0) {
// To print Fizz if true.
console.log("Fizz");

// To check if a number is divisible by 5.
} else if (i % 5 == 0) {
// To print Buzz if true
console.log("Buzz");

// To print the number if it does not meet any of the conditions above.
} else console.log(i);
}
</script>
</body>
</html>