blogna avie: Maret 2010

Login Form

coding:
<br /><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" <br />"http://www.w3.org/TR/html4/loose.dtd"> <br /><html> <br /><head> <br /><title>Cobain</title> <br /></style> <br /><style type="text/css"> <br /> <br /> <br /> <br /></style> <br /><script type="text/javascript"> <br /> <br />function login() { <br /> <br />var loginForm = document.getElementById("loginForm"); <br /> <br />if (loginForm.username.value == "") { <br /> <br />alert("Silahkan Masukkan User Name"); <br /> <br />return false; <br /> <br />} <br /> <br />if (loginForm.password.value == "") { <br /> <br />alert("Silahkan Masukkan Password."); <br /> <br />return false; <br /> <br />} <br /> <br />} <br /> <br /></script> <br /></head> <br /> <br /><body> <br /> <br /><form id="loginForm" action="aa.php" method="post"> <br /> <br /><div class="border1"> <br /> <br /><div class="border2"> <br /> <br /><h3 align="center">LOGIN </h3> <br /> <br /><hr/> <br /> <br /><p><strong>User Name</strong><br /> <br /> <br /><input type="text" name="username" size="30"/> <br /> <br /></p> <br /> <br /><p><strong>Password</strong><br /> <br /> <br /><input type="password" name="password" size="30"/> <br /> <br /></p> <br /> <br /><p> <br /> <br /><input type="submit" value="Login" onclick="login();"/> <br /> <br /></p> <br /> <br /></div> <br /> <br /></div> <br /> <br /></form> <br /> <br /></body> <br /> <br /></html> <br /> <br /> <br />

php-nya:
<br /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br /> <br /><html xmlns="http://www.w3.org/1999/xhtml"> <br /> <br /><head> <br /> <br /><title>Form Administrator</title> <br /> <br /></head> <br /> <br /><body> <br /> <br /> <br /><div align = "center"> <br /> <br /><?php <br /> <br />require_once('aa.php'); <br /> <br />$user = 'sufyan'; <br /> <br />$pass = '123456'; <br /> <br />if ((isset($_POST['username']) == $user)&&($_POST['password'] == $pass)){ <br /> <br />echo "<strong><font face='Verdana' size='3' color=red>Selamat Datang<br></strong></center>". $_POST['username']; <br /> <br />} <br /> <br />else { <br /> <br />echo "<strong><font face='Verdana' size='3' color=red>Username & Password yang anda masukkan salah<br></strong></center>"; <br /> <br />} <br /> <br />?> <br /></body> <br /> <br /></html> <br /> <br />

Membuat tabel pemesanan menggunakan JavaScript

| di 19.38

JavaScript adalah nama implementasi Netscape Communications Corporation untuk ECMAScript standar, suatu bahasa skrip yang didasarkan pada konsep pemrograman berbasis prototipe. Script sangat diperlukan dalam pembuatan HTML agar terlihat lebih dinamis, script juga dapat disisipkan dalam sebuah kode HTML.
pengen tau cara pembuatannya??
liat ne program HTMLnya....

<em><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>AVIE's cafe</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">

</style>

<!fungsi matematis tabel>
<script language = "JavaScript" type="text/JavaScript">

</script>
</head>

<body>
<h2 style="text-align:center; color: #FF0000;" class="style1" >ARDyAVIE's cafe </h2>
<form name="formcafe" action="#">
<table width="480" border="2" align="center" style="border-">
<tr bgcolor="#000000">
<th><span class="style10">No</span></th>
<th><span class="style10">Daftar Menu </span></th>
<th><span class="style10">Harga</span></th>
<th><span class="style10">Order</span></th>
</tr>
<tr bgcolor="pink">
<td width="27"><div style="text-align:center"><strong>1.</strong></div></td>
<td width="181"><strong>Nasi Goreng</strong></td>
<td width="118" ><strong>@
<input type="text" name="nasi" value="5000" size="10" disabled="disabled">
</strong></td>
<td width="124" ><input name="gorengaa" type="text" onkeyup="cafe()" value="0" size="20"></td>
</tr>
<tr style="background-color:pink">
<td><div style="text-align:center"><strong>2.</strong></div></td>
<td><strong>Ayam Bakar</strong></td>
<td><strong>@
<input type="text" name="ayam" value="10000" size="10" disabled="disabled">
</strong></td>
<td><input name="bakaraa" type="text" onkeyup="cafe()" value="0" size="20"></td>
</tr>
<tr bgcolor="pink">
<td><div style="text-align:center"><strong>3.</strong></div></td>
<td><strong>Juice </strong></td>
<td><strong>@
<input type="text" name="ju" value="5000" size="10" disabled="disabled">
</strong></td>
<td><input name="ceaa" type="text" onkeyup="cafe()" value="0" size="20"></td>
</tr>
<tr style="background-color:pink">
<td><div style="text-align:center"><strong>4.</strong></div></td>
<td><strong>Softdrink</strong></td>
<td><strong>@
<input type="text" name="so" value="2500" size="10" disabled="disabled">
</strong></td>
<td><input name="riaa" type="text" onkeyup="cafe()" value="0" size="20"></td>
</tr>
<tr bgcolor="pink">
<td><div style="text-align:center"><strong>5.</strong></div></td>
<td><strong>Salad</strong></td>
<td><strong>@
<input type="text" name="sa" value="6000" size="10" disabled="disabled">
</strong></td>
<td><input name="ladaa" type="text" onkeyup="cafe()" value="0" size="20"></td>
</tr>
<tr style="background-color:RED">
<td colspan="3"><div style="text-align:center">
<div align="center"><strong>Total </strong></div>
</div></td>
<td><input name="TotalBayar" type="text" style="text-align:center" disabled="disabled" value="-" size="20"></td>
</tr>
<tr style="background-color:yellow">
<td colspan="3"><div style="text-align:center">
<div align="center"><strong>Diskon )*</strong></div>
</div></td>
<td><input name="Diskon" type="text" style="text-align:center" disabled="disabled" value="-" size="20"></td>
</tr>
<tr style="background-color:green">
<td colspan="3"><div style="text-align:center">
<div align="center"><strong>Jumlah Pembayaran </strong></div>
</div></td>
<td><input name="JumlahBayar" type="text" style="text-align:center" disabled="disabled" value="-" size="20"></td>
</tr>
</table>
<p style="text-align:center"> </p>
<p style="text-align:center"><span class="style14">)* </span><span class="style15">:<span class="style16"> <span class="style17">Menunjukkan Jumlah potongan dikarenakan Pemesanan telah melebihi Rp. 50.000,00. Potongan tidak berlaku kelipata</span>n</span></span> <br/>
</p>
<div id="Layer1" style="position:absolute; width:63px; height:23px; z-index:1; left: 600px; top: 326px;">
<input name="button" type="button" onclick="start()" value="PESANAN BARU" size="15">
</div>
</form>
</body>
</html>
</em>

selamat mencoba.......

Desain Layout Halaman Web

| di 20.11

untuk membuat Desain layout halaman web, pengen tau caranya kan??
coba liat aja disini,pasti kamu-kamu bisa praktekin sendiri.nah untuk programnya neh...
gambar1:

<em><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" lang="en">

<head>
<title>Desain Halaman Web Oleh_Agustin Muvidhatul I</title>
<link rel="stylesheet" href="modul3b.css" type="text/css">

</head>

<body>
<div id="wrapper">
<div id="header">
<div id="Gambarum">
</div>
<div class="style4" id="Te">PT. HM. SAMPOERNA Tbk
</div>
<div id="aaaa">
<div class="style6" id="atas">
<div align="right" class="style7"><a href="http://localhost/Modul 2/modul3b.html" target="_blank" class="style7">Home</a> | <a href="http://localhost/Modul 2/modul3b.html" target="_blank" class="style7">Information</a> | <a href="http://localhost/Modul 2/modul3b.html" target="_blank" class="style7">News</a> | <a href="http://localhost/Modul 2/modul3b.html" target="_blank" class="style7">Contact</a> | <a href="http://localhost/Modul 2/modul3b.html" target="_blank" class="style7">About Us</a> </div>
</div>
<div id="search">
<div class="style7" id="search1">
<div align="right"><em><strong>
Search
</strong></em></div>
</div>
<div id="search2"></div>
</div>

</div>
</div>
<div id="inner">
<div id="sidebar">
<div id="leftmenu">
<ul>
<li>
<div align="center"><a href="http://localhost/Modul 2/modul3b.html">Home</a></div>
</li>
<li>
<div align="center"><a href="http://localhost/Modul 2/modul3b.html">News </a></div>
</li>
<li>
<div align="center"><a href="http://localhost/Modul 2/modul3b.html">Visi & Misi</a></div>
</li>
<li>
<div align="center"><a href="http://localhost/Modul 2/modul3b.html">Perusahaan</a></div>
</li>
<li>
<div align="center"><a href="#">Download</a></div>
</li>
</ul>
</div>
</div>
<div id="Inner2">
<div id="top">
</div>
<div id="content">
<p class="style2">Beasiswa Perusahaan </p>
<p class="style3">Oleh : Agustin Muvidhatul I</p>
<p class="style3">Penerimaan beasiswa secara simbolik oleh PT. HM. Sampoerna </p>
<p class="style3">bertempat di Kantor pusat PT. HM. Sampoerna Tbk. di Surabaya
</p>
</div>
<div id="right">
</div>
<div id="Rightup">
<p align="center" class="style8">Beasiswa Perusahaan PT. HM Sampoerna Tbk. </p>
</div>
<div id="Rightbot">
<div align="center" class="style11"><u>PT. HM. SAMPOERNA Tbk</u>
</div>
</div>
</div>
</div>
<div id="footer">
<p align="right" class="style10">Design Oleh Agustin Muvidhatul I © PTI 07 </p>

</div>
</div>
</body>
</html></em>

ne CSSnya =
#wrapper {
margin: auto;
width: 997px;
border: 0;
}
#header {
height: 120px;
border: 1px solid blue;
margin-bottom:2px;
background:blue url('Header2.jpg');
}
#Gambarum {
float: left;
height: 63px;
width:61px;
margin-top:20px;
margin-left:50px;
border: 0;
background:red url('Logo.png');
}
#Te {
float: left;
height: 35px;
width:300px;
margin-top:35px;
margin-left:5px;
}
#aaaa {
float: right;
height: 120px;
width:400px;
border: 0;
}
#atas {
float: left;
height: 25px;
width:350px;
margin-left:30px;
margin-top:2px;
border: 0;
}
#search {
clear:both;
float: right;
height: 20px;
width:300px;
margin-top:67px;
margin-right:20px;
border: 0;
}
#search1 {
float: left;
height: 15px;
width:120px;
margin-left:50px;
margin-top:4px;
border: 0;
}
#search2 {
float: right;
height: 17px;
width:110px;
margin-right:2px;
margin-top:4px;
border: 1px solid white;
background:white;
}
#inner {
float: left;
border: 0;
}
#sidebar {
float: left;
margin-right: 0px;
width: 250px;
height:420px;
border: 1px solid blue;
background:blue url('sidebar.jpg');
}
#Inner2 {
float: left;
width: 745px;
height: 420px;
border: 0;
}
#top{
height: 80px;
border: 0;
background:blue url('BG.jpg');
}
#content {
float: left;
margin-top:10px;
margin-right:15px;
margin-left:15px;
width: 460px;
height: 323px;
border: 0;
}
#right {
float: left;
width: 250px;
height: 200px;
margin-top:10px;
border: 1px solid green;
background:blue url('Beasiswa.jpg');
}
#Rightup {
float: left;
width: 250px;
height: 80px;
margin-top:3px;
border: 1px solid Blue;
background-color:black;
}
#Rightbot {
float: left;
width: 250px;
height: 26px;
margin-top:10px;
border: 0;
list-style-position:inside;
}
#footer {
clear: both;
height: 80px;
border: 1px solid blue;
background:blue url('Footer1.jpg');
}
.style2 {
font-size: 24px;
font-weight: bold;
color: #000099;
}
.style3 {
color: #0000CC;
font-weight: bold;
}
.style4 {
font-family: "Arial", Times, serif;
font-size: xx-large;
color: #FFFFFF;
font-weight: bold;
}
.style6 {
font-family: "Arial", Times, serif;
font-weight: bold;
}
.style7 {color: #FFFFFF}
.style8 {
font-family: "Arial", Times, serif;
font-size: 16px;
font-weight: bold;
color: #FFFFFF;
}
.style10 {
color: #FFFFFF; font-size: 12px;
}
.style11 {
color: #000066;
font-weight: bold;
}
#leftmenu ul {
width: 250px;
list-style-type:none;
padding:0; margin:0;
}
#leftmenu a:link, #leftmenu a:visited, #leftmenu a:active {
padding-left: 15px;
text-decoration: none;
}
#leftmenu a {
padding: 5px 0px 5px 15px; display: block;
background: blue url('button.jpg');
margin: 0px 0px 1px; color: #ffffff;
}
#leftmenu a:hover {
background: #000066 no-repeat left center; color: #ffffff
}

Gambar 2:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" lang="en">

<head>
<title>Desain_Layout_Halaman_Web_Oleh_Agustin Muvidhatul I</title>
<link rel="stylesheet" href="modul3a.css" type="text/css">
</head>

<body>
<div id="wrapper">
<div id="header">
Header</div>
<div id="inner">
<div id="sidebar">
Sidebar
</div>
<div id="aaaa">
<div id="top">
Top
</div>
<div id="content">
Content
</div>
<div id="right">
Right
</div>
</div>
</div>
<div id="footer">
Footer
</div>
</div>

</body>
</html>

CSSnya=
#wrapper {
margin: auto;
width: 756px;
border: 1px solid Blue;
}
#header {
height: 70px;
border: 1px solid green;
}
#inner {
float: left;
margin: 5px 0;
border: 1px solid black;
}
#sidebar {
float: left;
margin-right: 20px;
width: 180px;
height: 330px;
border: 1px solid red;
}
#aaaa {
float: left;
width: 550px;
height: 330px;
border: 1px solid green;
}
#top{
height: 70px;
border: 1px solid red;
}

#content {
float: left;
margin-right: 20px;
width: 320px;
height: 250px;
border: 1px solid red;
}
#right {
float: right;
width: 205px;
height: 200px;
border: 1px solid green;
}
#footer {
clear: both;
height: 50px;
border: 1px solid green;
}

blogna avie

Login Form

Membuat tabel pemesanan menggunakan JavaScript

Desain Layout Halaman Web

Link Qoe

Labels

Blog Archive

About Me