Progweb UTS

<!
DOCTYPE html>
<html>
<head>
<title>Latihan HTML</title>
<style>
a {
text-decoration: none;
color: black;
margin: 0 10px;
}
a:hover {
color: red;
}
img {
width: 30%;
height: 100%;
}
p {
font-size: 30px;
text-align: justify;
}
.main {
background-color: bisque;
width: auto;
height: 500px;
}
.kotak {
display: inline-block;
background-color: red;
width: 19.4%;
height: 100px;
border: 2px solid black;
margin: 0;
padding: 0;
}
.menu {
position: absolute;
right: 30px;
top: 30px;
}
.navigasi {
background-color: aqua;
padding: 30px;
}
.goyang {
width: 100px;
height: 100px;
background-color: brown;
position: relative;
}
.gbr2 {
visibility: hidden;
margin-left: 1100px;
}
</style>
</head>
<body>
<div class="navigasi">
<div class="menu">
<a href="index.html">Home</a>
<a href="about.html">About</a>
<a href="contact.html">Contact Us</a>
</div>
</div>
<marquee behavior="" direction="">
<h1>Selamat Datang di Website kami</h1>
</marquee>
<h1>Selamat Pagi</h1>
<h6>di website kami</h6>
<div class="gambar" align="center">
<img src="gambar1.jpg" alt="">
</div>
<h2>Daftar Peserta</h2>
<table border="1px">
<tr>
<th>Nama</th>
<th>Umur</th>
</tr>
<tr>
<td>Alvin</td>
<td>21</td>
</tr>
<tr>
<td>Evan</td>
<td>21</td>
</tr>
</table>
<h2>Daftar Kegiatan</h2>
<ul>
<li>mandi</li>
<li>makan</li>
</ul>
<ol>
<li>bernapa</li>
<li>minum</li>
</ol>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex adipisci
reprehenderit ea molestiae tenetur quaerat.
</p>
<div class="main">
<div class="kotak"></div>
</div>
<img class="goyang gbr1" src="gambar1.jpg" onmouseover="hilang1(this)">

<img class="goyang gbr2" src="gambar2.jpg" onmouseover="hilang2(this)">
<script>
function hilang1(x) {
document.getElementsByClassName("goyang")[0].style.visibility =
"hidden";
"visible";
}
function hilang2(x) {
"hidden";
"visible";
}
function kecil(x) {
x.style.height = "100px";
x.style.width = "100px";
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script language="javascript" src="jquery-3.3.1.slim.js"></script>
<title>Hitung</title>
</head>
<body>
<form action="">
R1= <input type="text" name="" id="r1" value="0"> Ohm<br>
R2= <input type="text" name="" id="r2" value="0"> Ohm<br>
R3= <input type="text" name="" id="r3" value="0"> Ohm<br><br>
Tegangan= <input type="text" name="" id="tegangan" value=""> Volt<br>

<br>
<input type="button" value="Hitung" id="" onclick="hitung()"><br><br>
Arus= <input type="text" name="" id="arus" value="" disabled> mA

</form>
<script type="text/javascript">
var r1 = 0;
var r2 = 0;
var r3 = 0;
var i = 0;
var v = 0;
function hitung() {
r1 = parseInt($("#r1").val(), 10);
r2 = parseInt($("#r2").val(), 10);
r3 = parseInt($("#r3").val(), 10);
v = parseFloat($("#tegangan").val(), 10);
var rs = r1 + r2 + r3;
i = (v / rs) * 1000;
$("#arus").val(i);
}
</script>
</body>
</html>
<!DOCTYPE HTML>
<html>
<head>
<title>Menghitung Luas Persegi Panjang</title>
<script type="text/javascript">
function Tambah() {
document.getElementById("Arus").value -= -10;
}
function Kurang() {
if (document.getElementById("Arus").value > 0)
{ document.getElementById("Arus").value -= 10;}
}
function hitungTegangan() {
resistansi = 0;
Tegangan = 0;
Arus = document.getElementById("Arus").value;
Resistor1 = document.getElementById("Pertama").value;
Resistor2 = document.getElementById("Kedua").value;
resistansi = 1 / (Resistor1) + 1 / (Resistor2);

resistansi = 1 / (resistansi)
Tegangan = resistansi * Arus / (1000);
document.getElementById("Hasil").value = Tegangan;
}
</script>
</head>
<body>
Menghitung Resistor Parallel<br />
Resistor 1 : <input type="text" id="Pertama" name="Pertama"><br />
Resistor 2 : <input type="text" id="Kedua" name="Kedua"><br />
Arus: <br />
<input type="button" id="btnTambah" value="+" onclick="Tambah();">
<input type="text" id="Arus" name="Arus"> mA
<input type="button" id="btnKurang" value="-" onclick="Kurang();"><br />
<input type="button" id="btnHitung" value="Hitung Nilai Tegangan"
onclick="hitungTegangan();"><br />
Hasil : <input type="text" id="Hasil" name="Hasil"> V
</body>
</html>
<html>
<head><title>Menghitung Tegangan Resistor</title></head>
<body>
Resistor 1: <input type="text" id="r1" value="0" name="ressitor1"><br>
Resistor 2: <input type="text" id="r2" value="0" name="ressitor2"><br><br>
Arus: <br>
<input type="button" id="kurang" value="-" name="kurang" onclick="kurang()">
<input type="text" id="arus" name="arus" value="0" disabled> mA
<input type="button" id="tambah" value="+" name="tambah"
onclick="tambah()"><br><br>
<input type="button" id="hitung" value="Hitung" name="hitung"
onclick="hitung()"> <br><br>
Tegangan: <input type="text" id="tegangan" value="" name="tegangan"
disabled> Volt
<script>
var i = 0;
var r1 = 0;
var r2 = 0;
function kurang() {
if (i > 0)
{ i -= 10;
document.getElementById("arus").value = i; }
}
function tambah() {
i += 10;
document.getElementById("arus").value = i;
}
function hitung() {
r1 = parseFloat(document.getElementById("r1").value, 10);
r2 = parseFloat(document.getElementById("r2").value, 10);
if (r1 <= 0 && r2 <= 0) {
document.getElementById("tegangan").value = 0;
} else {
var rp = (r1 * r2) / (r1 + r2);
var tegangan = i * rp / 1000;
document.getElementById("tegangan").value = tegangan;
}
}
</script>
</body>
</html>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Menghitung Luas Persegi Panjang</title>
<style>
#toleransi
{ display: inline; }
</style>
</head>
<body>
<table border="1px">
<tr>
<th><b> Kode Warna</b></th>
<th><b> Warna 1</b></th>
</tr>
<tr>
<th>Hitam</th>
<th>0</th>
<th>0</th>
<th>10^0</th>
<th>-</th>
</tr>
<tr>
<th>Coklat</th>
<th>1</th>
<th>1</th>
<th>10^1</th>
<th>1%</th>
</tr>
<tr>
<th>Merah</th>
<th>2</th>
<th>2</th>
<th>10^2</th>
<th>2%</th>
</tr>
<tr>
<th>Jingga</th>
<th>3</th>
<th>3</th>
<th>10^3</th>
<th>-</th>
</tr>
</table>
Menghitung Resistor dari Warna<br />
Pertama : <input type="text" id="Pertama" name="Pertama"><br />
Kedua : <input type="text" id="Kedua" name="Kedua"><br />
Ketiga : <input type="text" id="Ketiga" name="Ketiga"><br />
Keempat : <input type="text" id="Keempat" name="Keempat"><br />
<input type="button" id="btnHitung" value="Hitung Nilai Resistor"
onclick="hitungResistor();"><br />
Hasil : <input type="text" id="Hasil" name="Hasil">Ohm ± <p
id="toleransi"></p>%
</body>
<script>
function hitungResistor() {
Pertama = document.getElementById("Pertama").value.toLowerCase();
Kedua = document.getElementById("Kedua").value.toLowerCase();
Ketiga = document.getElementById("Ketiga").value.toLowerCase();
Keempat = document.getElementById("Keempat").value.toLowerCase();
Hasil = 0;
Pengali = 0;
Toleransi = 0;
switch (Pertama) {
case 'hitam': Hasil = Hasil + 0; break;
case 'coklat': Hasil = Hasil + 10; break;
case 'merah': Hasil = Hasil + 20; break;
case 'jingga': Hasil = Hasil + 30; break;
case 'kuning': Hasil = Hasil + 40; break;
case 'hijau': Hasil = Hasil + 50; break;
case 'biru': Hasil = Hasil + 60; break;
case 'ungu': Hasil = Hasil + 70; break;
case 'abu': Hasil = Hasil + 80; break;
case 'putih': Hasil = Hasil + 90; break;
}
switch (Kedua) {
case 'hitam': Hasil = Hasil + 0; break;
case 'coklat': Hasil = Hasil + 1; break;
case 'merah': Hasil = Hasil + 2; break;
case 'jingga': Hasil = Hasil + 3; break;
case 'kuning': Hasil = Hasil + 4; break;
case 'hijau': Hasil = Hasil + 5; break;
case 'biru': Hasil = Hasil + 6; break;
case 'ungu': Hasil = Hasil + 7; break;
case 'abu': Hasil = Hasil + 8; break;
case 'putih': Hasil = Hasil + 9; break;
}
switch (Ketiga) {
case 'hitam': Pengali = 1; break;
case 'coklat': Pengali = 10; break;
case 'merah': Pengali = 100; break;
case 'jingga': Pengali = 1000; break;
case 'kuning': Pengali = 10000; break;
case 'hijau': Pengali = 100000; break;
case 'biru': Pengali = 1000000; break;
case 'ungu': Pengali = 10000000; break;
}
Hasil = Hasil * Pengali;
switch (Keempat) {
case 'coklat': Toleransi = 1; break;
case 'merah': Toleransi = 2; break;
case 'hijau': Toleransi = 0.5; break;
case 'biru': Toleransi = 0.25; break;
case 'ungu': Toleransi = 0.1; break;
case 'emas': Toleransi = 5; break;
case 'perak': Toleransi = 10; break;
}
document.getElementById("Hasil").value = Hasil;
document.getElementById("toleransi").innerHTML = Toleransi;
}
</script>
</html>
<!DOCTYPE html>
<html>
<head>
<script language="javascript" src="jquery-3.3.1.slim.js"></script>
<title>Document</title>
</head>
<body>
<h1>Ini Halaman Contact Us</h1>
<p>Silahkan hubungi kami di sini</p>
<form action="">
Nama: <input type="text" name="" id="nama" value="" placeholder="Masukan
nama"><br>
Pass: <input type="password" name="" id="pass" value=""
placeholder="Masukan password"><br><br>
Jenis Kelamin: <br>

<input type="radio" name="gender" id="jenisL" value="0">Laki-laki <br>
<input type="radio" name="gender" id="jenisP" value="1">Perempuan <br>
Hobi: <br>
<input type="checkbox" name="hobi" id="hobi">Makan <br>
<input type="checkbox" name="hobi" id="hobi" checked>Minum <br>
<input type="checkbox" name="hobi" id="hobi">Bernapas <br>
Foto: <br>
<input type="file" name="upload" id="file"><br><br>
Pertanyaan:
<select name="" id="">
<option value="">Siapa nama anjingmu?</option>
<option value="">Siapa nama kucingmu?</option>
</select><br><br>
<input type="button" value="Kirim" id="kirim"
onclick="kirim()">
</form>
</body>
</html>

Progweb UTS

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Progweb UTS

Uploaded by

Copyright:

Available Formats

<!

<img class="goyang gbr1" src="gambar1.jpg" onmouseover="hilang1(this)">

Tegangan= <input type="text" name="" id="tegangan" value=""> Volt<br>

<input type="button" value="Hitung" id="" onclick="hitung()"><br><br>

Arus= <input type="text" name="" id="arus" value="" disabled> mA

resistansi = 1 / (Resistor1) + 1 / (Resistor2);

Jenis Kelamin: <br>

You might also like