Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

Membuat Variabel Penjumlahan dalam JavaScript | HTML

Membuat Variabel Penjumlahan dalam JavaScript | HTML

recudo.com - Hay guys.. Jumpa lagi nih dengan recudo. Gimana nih kabar kalian?. Semoga baik-baik saja yah. Disini admin akan memberikan tutorial tentang "Membuat Variabel Penjumlahan dalam JavaScript". Langsung aja nih, admin akan memberikannya secara singkat.

Langkah nya.

1. Copy paste coding ini.

<html>
<head>
<title>Variabel</title>
</head>

<body>
<p><script language="JavaScript">

document.writeln("<PRE>");
document.writeln("<h1>Variabel Penjumlahan dalam JavaScript</h1>")
;
document.writeln("<h2>Tambah</h2>")
var tambah1 = 10;
var tambah2 = 5;
var hasiltambah = tambah1+tambah2 ;

document.writeln(" Angka 1 adalah " +tambah1);
document.writeln(" Angka 2 adalah " +tambah2);
document.writeln(" Hasilnya adalah " +hasiltambah);

document.writeln("<h2>Pengurangan</h2>")
var kurang1 = 10;
var kurang2 = 5;
var hasilkurang = kurang1-kurang2 ;

document.writeln(" Angka 1 adalah " +kurang1);
document.writeln(" Angka 2 adalah " +kurang2);
document.writeln(" Hasilnya adalah " +hasilkurang);

document.writeln("<h2>Perkalian</h2>")
var kali1 = 10;
var kali2 = 5;
var hasilkali = kali1*kali2 ;

document.writeln(" Angka 1 adalah " +kali1);
document.writeln(" Angka 2 adalah " +kali2);
document.writeln(" Hasilnya adalah " +hasilkali);


document.writeln("<h2>Permbagian</h2>")
var bagi1 = 10;
var bagi2 = 5;
var hasilbagi = bagi1/bagi2 ;

document.writeln(" Angka 1 adalah " +bagi1);
document.writeln(" Angka 2 adalah " +bagi2);
document.writeln(" Hasilnya adalah " +hasilbagi);

document.writeln("<h2>Modulus</h2>")
var modulus1 = 10;
var modulus2 = 5;
var hasilmodulus = modulus1%modulus2 ;

document.writeln(" Angka 1 adalah " +modulus1);
document.writeln(" Angka 2 adalah " +modulus2);
document.writeln(" Hasilnya adalah " +hasilmodulus);

document.writeln("<PRE>");
</script></p>
</body>
</html>

2. Lalu save dengan ekstensi *html.

3. Lalu jalankan, dan akan tampil seperti ini.


4. Selesai.

Terima kasih telah mengunjungi artikel ini, semoga dapat bermanfaat dan semoga membantu kalian dalam mengerjakan tugas kalian.
Dan tetap nantikan artikel menarik dari recudo yah. ^_^.

Membuat Variabel Biodata dengan JavaScript | HTML

Membuat Variabel Biodata dengan JavaScript | HTML


recudo.com - Hay guys.. Jumpa lagi nih dengan recudo. Gimana nih kabar kalian?. Semoga baik-baik saja yah. Disini admin akan memberikan materi HTML mengenai "Membuat Variabel Biodata dengan JavaScript". Langsung aja nih admin akan memberikannya secara singkat.


1. Copy Paste coding seperti ini.

<html>
<head>
<title>Variabel</title>
</head>

<body>
<p><script language="JavaScript">

document.writeln("<PRE>");
document.writeln("<h1>Contoh Variabel Biodata dalam JavaScript</h1>")
;
var nama = "recudo";
alamat = "Medan";
tgl = "24 Mei 188";
var umur = 18;

document.writeln(" Nama saya adalah " +nama);
document.writeln(" Alamat saya adalah " +alamat);
document.writeln(" Tanggal Lahir saya adalah " +tgl);
document.writeln(" Umur saya adalah " +umur);

document.writeln("<PRE>");
</script></p>
</body>
</html>

2. Lalu simpan file dengan ekstensi *html.

3. Lalu jalankan file nya.

4. Selesai.

Terima kasih telah mengujungi artikel ini, semoga dapat bermanfaat dan semoga membantu kalian dalam menjalan tugas kalian.
Dan tetap nantikan artikel menarik dari recudo yah.

Membuat Fade Toogle dengan jQuery | HTML

Membuat Fade Toogle dengan jQuery | HTML

recudo.com - Hay guys.. Jumpa lagi nih dengan recudo. Gimana nih kabar kalian?. Semoga baik-baik saja yah. Disini admin akan memberikan tutorial tentang HTML "Membuat Fade Toogle pada HTML". Langsung aja nih admin akan memberikannya secara singkat.

Langkahnya:

1. Buka aplikasi dreamweaver, lalu pilih HTML, dan akan tampil gambar di bawah ini.


2. Lalu masukkan koding seperti ini.

<html>
 <head>
<script src="jquery-3.2.1.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#div1").fadeToggle(500);
        $("#div2").fadeToggle(1000);
        $("#div3").fadeToggle(2000);
    });
});
</script>
</head>
<body>

<p><b>Cara Membuat Fade Toogle pada jQuery</p>

<button>Fade In/Out</button><br><br>

<div id="div1" style="width:100px;height:100px;background-color:red;"></div>
<br>
<div id="div2" style="width:100px;height:100px;background-color:blue;"></div>
<br>
<div id="div3" style="width:100px;height:100px;background-color:pink;"></div>
</body>
</html>


3. Setelah itu, simpan dengan ekstensi *html


4. Setelah itu buka file yang telah kalian simpan, lalu jalan kan.

5. Okey, selesai.

Terima kasih untuk kalian yang telah mengunjungi artikel ini, semoga dapat bermanfaat dan semoga membantu kalian dalam mengerjakan tugas kalian.
Dan tetap nantikan artikel menarik dari recudo yah.



Mencari Hari dengan Switch dengan JavaScript | HTML

 Mencari Hari dengan Switch dengan JavaScript | HTML

recudo.com - Hay guys.. Jumpa lagi nih dengan recudo. Gimana nih kabar kalian?. Semoga baik-baik saja yah. Disini admin akan memberikan tutorial tentang HTML "Mencari Hari dengan Switch pada JavaScript". Langsung saja admin akan memberikan nya secara singkat.

Langkah nya:

1. Buka aplikasi Dreamweaver kalian, lalu pilih HTML, dan akan muncul tampilan sepeti ini.


2. Setelah itu, copy paste coding seperti ini.

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Switch</title>
<script>
function carihari() {
var hari= parseInt(document.form1.hari.value);
var namahari="";
switch (hari)
{
case 1 : namahari="hari ke 1 adalah = Senin";break;
case 2 : namahari="hari ke 2 adalah = Selasa";break;
case 3 : namahari="hari ke 3 adalah = Rabu";break;
case 4 : namahari="hari ke 4 adalah = Kamis";break;
case 5 : namahari="hari ke 5 adalah = Jumat";break;
case 6 : namahari="hari ke 6 adalah = Sabtu";break;
case 7 : namahari="hari ke 7 adalah = Minggu";break;
default : namahari="Anda salah mengisi";
}
alert(namahari);
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<p><strong>Mencari Hari dengan Switch pada JavaScript</strong></p>
<p>
  <label for="textfield">Masukkan Nomor Hari  </label>
  <input type="text" name="hari" id="hari" />
</p>
<p>
    <input type="button" name="Proses" id="proses" onclick="carihari()" value="Proses" />
    <input type="reset" name="Submit2" value="Reset" />
  </p>
</form>
</body>
</html>

3. Setelah itu, simpan file dengan ekstensi *html, seperti tampilan dibawah ini.


4. Setelah itu, buka file Switch.html tersebut, dan akan muncul tampilan seperti ini.


5. Setelah itu, inputkan nomor hari terserah kalian, disini admin akan memberikan nomor 5.


6. Okey, selesai.

Terima kasih untuk kalian yang telah mengunjungi artikel ini, semoga dapat bermafanfaat untuk kalian yang sedang mencari tugas seperti ini.
Dan tetap nantikan artikel menarik dari recudo yah.









Membuat Form Login dengan IF Else dengan JavaScript | HTML

Membuat Form Login dengan IF Else dengan JavaScript | HTML

recudo.com - Hay guys.. Jumpa lagi nih dengan recudo. Gimana nih kabar kalian?. Semoga baik-baik saja yah. Disini admin akan memberikan tutorial tentang HTML "Membuat Form Login dengan IF Else pada JavaScript". Langsung aja nih admin akan memberikan nya secara singkat.

Langkah nya.

1. Buka aplikasi Dreamweaver kalian, lalu pilih HTML, dan akan tampil seperti dibawah ini.


2. Setelah itu, Copy Paste  coding seperti in:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>IF Else</title>
<script>
function Login() {

var username=document.login.username.value;
var password=document.login.password.value;
if(username=="recudo" && password=="contoh"){
alert("Username dan password anda Benar");
}
else {
alert("Username dan Password anda Salah");
}
}
</script>
</head>

<body>
<form name="login">
  <tr><td><p><strong>Membuat Form Login dengan IF Else pada JavaScript </strong></p>
    <p>Username
      <input type="text" name="username" />
    </p>
    </td>
  </tr>
  <tr><td><p>Password
      <input type="" name="password" />
    </p></td></tr>
  <tr><td colspan="2" align="left"><p>
        <input type="button" value="Login" onclick="Login()"/>
      </p></td></tr>
</form>
</body>
</html>

3. Setelah itu, simpan file dengan ekstensi *html, seperti tampilan di bawah ini.


4. Setelah itu, buka file IfElse.html tersebut, lalu akan muncul tampilan seperti di bawah ini;


5. Setelah itu, inputkan Username dan Password nya


6. Okey, selesai.

Terima kasih telah mengunjungi artikel ini, semoga dapat bermanfaat bagi kalian yang sedang mencari tugas seperti ini.
Dan tetap nantikan artikel menarik dari recudo yah.








Mencari Umur Manusia dengan IF Else IF pada JavaScript | HTML

Mencari Umur Manusia dengan IF Else IF pada JavaScript | HTML

recudo.com - Hay guys.. Jumpa lagi nih dengan recudo. Gimana nih kabar kalian?. Semoga baik-baik saja yah. Disini admin akan memberikan tutorial tentang HTML "Mencari Umur Manusia dengan IF Else IF pada JavaScript". Langsung aja admin akan memberikan tutorial secara singkat di bawah ini:

Langkah nya :

1. Buka aplikasi dreamweaver nya, lalu kalian pilih HTML, seperti tampilan dibawah ini.


2. Setelah itu, masukkan koding seperti ini.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>IF Else IF</title>
<script>
function cek(){
var umur = parseInt(document.form1.umur.value);

if(umur <= 5) {
alert("Balita");
}
else if(umur <= 16) {
alert("Remaja");
}
else {
alert("Dewasa");
}
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<p><strong>Mencari Umur Manusia dengan IF Else IF pada JavaScript </strong></p>
<p>
  <label for="textfield">Masukkan Umur</label>
  <input type="text" name="umur" id="umur" />
</p>
<p>
    <input type="button" name="Proses" id="proses" onclick="cek()" value="Proses" />
    <input type="reset" name="Submit2" value="Reset" />
  </p>
</form>
</body>
</html>


3. Setelah itu simpan dengan ekstensi *html, seperti tampilan dibawah ini.


4. Setelah itu, buka file IfElseIF.html itu, dan akan muncul tampilan seperti ini.

5. Setelah itu, iputkan nilai terserah kalian, disini admin akan memberikan umur 19.


6. Okey, selesai.

Terima kasih untuk kalian yang telah mengunjungi artikel ini, semoga dapat bermanfaat untuk kalian yang sedang mencari materi seperti ini.
Dan tetap nantikan artikel menarik dari recudo yah.