Membuat program hitung luas lingkaran dengan javascript
Halo gan, kali ini saya akan ngasih tau script html + javascript. barangkali agan ada yang dikasih tugas disuruh buat html dengan tambahan javascript untuk menghitung luas lingkaran , dengan meng-input kan nilai jari-jarinya.
Nanti akan ada input teks yang harus dimasukkan nilai jari-jari lingkarannya. lalu agan tinggal klik hitung aja. otomatis javascript akan bekerja dan nilai luas lingkaran tersebut akan muncul deh.. oke kita langsung saja lihat scriptnya dibawah :) cekidot.
baca juga : Javascript Kalkulator Zodiak
ini scriptnya :
<html>
<head>
<title> Muhamad Ahmadin </title>
<style>
fieldset {width:400px;
background-color:#333;
border-top:11px solid maroon;
border-radius:20px 10px;
margin:auto;
transition:2s;}
fieldset:hover {box-shadow:5px 8px 11px maroon;
padding:10px;
margin:auto;}
button {background-color:maroon;
color:black;
font-family:courier;
border:1px solid maroon;
border-radius:5px 5px;
transition:2s;
cursor:pointer;}
button:hover {padding:13 30;
background-color:firebrick;
color:white;
font-weight:bold;
font-size:16px;
border-radius:10px 5px;}
</style>
</head>
<body>
<br>
<script language="javascript">
function LK() {
var jari = parseFloat(document.arz.nilai_jari.value);
if (isNaN(jari)){ jari=0.0;}
var hasil = 3.14*jari*jari;
alert(" Jadi, Luas Lingkaranya Adalah : "+ hasil.toFixed(0));
}
</script> <br><br><br>
<fieldset>
<form name="arz">
<pre>
<div style="font-family:calibri;
color:white;">
Nilai Jari-Jari Lingkaran = <input style="border-radius:5px 10px;background-color:floralwhite;padding:3px;" type="text" name="nilai_jari" /></div>
</pre>
<center>
<button value=" Hitunk " onClick="LK()"> Hitunk </button>
<button type="reset" value=" Hapuz " >Hapuz </button> </center>
</script>
</form> </fieldset> <br>
<div style="border-top:6px solid #800000;
width:60%;
margin:auto;
border-radius:111px;"> </div> <br><br>
<br>
</body>
</html>
Yow, itu scriptnya diatas. dan ini hasil Output dari script diatas :
Catatan : jika agan mau ngedit tampilan outputnya, tinggal di edit aja scriptnya, barangkali ada yang mau di edit biar lebih bagus lagi gitu :v. oh iya, itu saya pake transisi hover biar keren hohoho
Oke , semoga script diatas bisa bermanfaat buat agan.