Responsive Advertisement

Membuat Game Tebak Angka Sederhana Menggunakan Html Dan Javascript

Game Tebak Angka

Membuat Game Tebak Angka Sederhana Menggunakan Html Dan Javascript
Baiklah teman-teman kali ini kita akan mencoba membuat game sederhana menggunakan html dan javascript.
Berikut Demo Gamenya :

Game Tebak Angka

Cumaweb.site







Bagai mana membuatnya?
1.   Buat file html
2.   Kemudian copy dan pastekan kode dibawah ini kedalam file html teman teman


<style type="text/css">
body{
width: 100%
}
input{
background: #13131326;
width: 100%;
outline: none;
}
button{
width: 50%;font-weight: 700;
color: white;cursor: pointer;
}
input,button{
padding: 10px;border: 0;border-radius: 20px;
display: block;margin-top: 20px;
}
.box{
width: 60%;display: flex;clear: both;
margin: 0 auto;text-align: center;
}
#reset{
background: #FF9800;
}
#cek{
background: #4DB6AC;
}
h3,h5{
margin: 0;font-family: 'Verdana';text-align: center;
}
</style>
<body>
<h3>Game Tebak Angka</h3>
<h5>Cumaweb.site</h5>

<div class="box">
<input type="number" name="inputan" id="inputan">
</div>

<div class="box">
<button id="reset" onclick="randomAngka()">Reset Angka</button>
<button id="cek" onclick="cekAngka()">Cek</button>
</div>

</body>
<script type="text/javascript">
var angka;
function randomAngka(){
angka = Math.floor(Math.random() * 11);
return angka;   
}
randomAngka();
function cekAngka() {
var inputan = document.getElementById('inputan').value;
if (inputan == angka) {
alert('Benar angkanya adalah '+ angka);
}else if(inputan<angka){
alert('Angka yang kamu masukkan terlalu kecil')
}else{
alert('Angka yang kamu masukkan terlalu besar')
}
}
</script>


3.   Kemudian jalankan file html teman-teman di browser.
4.   Taraaa!! Jadideh

Tags

Post a Comment

1 Comments