KhassifaELek Go-Blog: Maret 2010

Jadwal Perempat Final Liga Champion 2010

Inilah jadwal perempat final Liga Champion 2010 berikutnya dilanjutkan dengan semi final Liga Liga Champion selengkapnya. Delapan tim yang lolos ke babak perempat final Liga Champions musim ini adalah Manchester United, Olympique Lyon, Arsenal, Bayern Munich, Inter Milan, CSKA Moskow, Girondins Bordeaux dan yang terakhir juara bertahan Barcelona.

Jadwal Perempat Final dan Semi Final Liga Champion 2010
Arsenal dan Munich adalah dua tim yang pertama memastikan tempat. Mereka masing-masing menggasak FC Porto serta Fiorentina dengan agregat kemenangan 6-1 dan 4-4, The Bavarian hanya menang agesivitas dari La Viola dimana mereka berhasil membukukan gol tandang lebih banyak.

Finalis musim lalu United menyusul langkah The Gunners. Mereka berhasil meluluhlantakkan perlawanan wakil Italia lainnya AC Milan dengan agregat 7-2.

Babak Perempat Liga Champion 2010 ini tampaknya partai akan mengulang Final Piala Champion 2009 lalu dan mempertemukan kembali antara Manchester United versus El Barca Barcelona. Atau mungkin Arsenal akan membuat kejutan untuk mesuk final kembali? Kita tunggu saja hasilnya. Berikut Jadwal Perempat Final dan Semi Final Liga Champion 2010 selengkapnya

Selasa, 30 Maret 2010 (Perempat Final Pertama)
Lyon vs Bordeaux
Bayern Munchen vs Man. United

Rabu, 31 Maret 2010 (Perempat Final Pertama)
Arsenal vs Barcelona
Internationale Milan vs CSKA Moskow

Selasa, 6 April 2010 (Perempat Final Kedua)
Barcelona vs Arsenal
CSKA Moskow vs Internationale Milan

Rabu, 7 April 2010 (Perempat Final Kedua)
Bordeaux vs Lyon
Man. United vs Bayern Munchen

Semifinal Liga Champion
Pemenang seperempatfinal 2 Vs Pemenang seperempatfinal 1
Pemenang seperempatfinal 4 Vs Pemenang seperempatfinal 3
Leg I : 21 April dan 22 April 2010
Leg II 28 April dan 29 April 2010

sumber: lengekep.blogspot.com Readmore...

Perempat Final Liga Champion

saya menjagokan barcelona yang akan mengangkat Trofi Liga Champions 2010 pada final nanti,saya ckup pede karena tahun kemarin kan barcelona yang menang,he... mudah2an saja..amin...ehmm.....tapi sepertinya semua club mempunyai peluang yang sama, karena cuman Klub-klub pilihan yang kuat dan keren yang akan mampu mengisi peluang semifinal Liga Champions 2010. Chayo BarcaQ.....
Bagaimana dengan yang lain...?!terserah anda,he... Readmore...

Membuat Tabel Fleksibel dengan PHP

Pembuatan tabel fleksibel menggunakan Pemrograman PHP sangatlah penting, kita hanya perlu menggenerate row, coloum, maupun cell yang kita inginkan. berikut kita mengulas kembali sekilas penjelasan tentang PHP (PHP: Hypertext Preprocessor) merupakan salah satu bahasa webscripting yang sangat powerful. Sejak pertama kali diperkenalkan, bahasa ini dimaksudkan untuk menghasilkan halaman-halaman web yang dinamis.
Hingga saat ini, PHP banyak sekali digunakan dalam membuat aplikasi web-baik lokal maupun Internet-dinamis dan atraktif.

Berikut saya akan membahas tentang bagai mana kita membuat program sederhana untuk men-generate sel tabel secara fleksibel. Tekniknya, buat sebuah fungsi yang menerima argumen berupa jumlah sel dan jumlah kolom. Jadi, pembentukan sel tabel didasarkan pada nilai jumlah sel dan jumlah kolom yang diberikan. Sebagai contoh, hasil program dengan argumen 12 (sel) dan 3 (kolom) diperlihatkan seperti pada gambar di bawah ini:

Pada Gambar Tersebut Setelah Di Klik Generate Untuk Menghasilkan Tabel yang dinginkan sehingga dapat diperoleh hasil seperti pada gambar 2. mod4tgs2 :

Untuk memperoleh tampilan web seperti gambar di atas adapun source codenya adalah sebagai berikut:

yang pertama source code php seperti di bawah ini:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Hasil Generate Tabel</title>
</head>
<body>
<div align="center">
<?php
$rows = 1;
$columns = 1;
$cells = 1;
?>

<?php $rows = (int) $_POST["JumlahRow"]; ?>
<?php $columns = (int) $_POST["JumlahColum"]; ?>
<?php $cells = (int) $_POST["JumlahCell"]; ?>

<strong>Kamu Memilih</strong> <?php echo $rows; ?> <em>rows,</em><br />
<strong>Kamu Memilih</strong> <?php echo $columns; ?> <em>columns,</em><br />
<strong>Dan Anda Membutuhkan</strong> <?php echo $cells; ?> <em>cells,</em><br />
<br />
<br />
<?php
$width = $columns * 75;
echo "<table width=".$width." border=1>";
$rw = 0;
$cel = 1;
while ($rw < $rows && $cel <= $cells)
{
echo "<tr>";
$cl = 0;
while ($cl < $columns)
{
if ($cel <= $cells)
{
echo "<td><div align=center>".$cel."</div></td>";
$cel++;
}
$cl++;
}
echo "</tr>";
$rw++;
}
echo "</table>";
?>
</div>
</body>
</html>

dilanjutkan dengan source code htmlnya

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Novi Khassifa</title>
<style type="text/css">

</style>
</head>
<body>
<form method="post" action="tgsmod5.php">
<h3 align="center" class="style1">__Tabel Fleksibel Dengan Generate Table__</h3>
<div align="center">
<table width="327" border="0" bgcolor="#FFFFFF">
<tr bgcolor="#FFFFCC">
<td width="121" style="text-align:center">Rows</td>
<td width="196"><strong>= </strong>
<input name="JumlahRow" type="text" id="JumlahRow" onKeyUp="getmax();" onfocus="this.select();"></td>
</tr>
<tr bgcolor="#CCFFCC">
<td style="text-align:center"><label>Columns</label></td>
<td><strong>= </strong>
<input name="JumlahColum" type="text" id="JumlahColum" onKeyUp="getmax();" onfocus="this.select();"></td>
</tr>
<tr bgcolor="#FFFFCC">
<td style="text-align:center">Cell Total </td>
<td><strong>= </strong>
<input name="JumlahCell" type="text" id="JumlahCell" onKeyUp="getmax();" onFocus="this.select();"></td>
</tr>
<tr bgcolor="#CCFFCC">
<td style="text-align:center">Max Cells </td>
<td><strong>= </strong>
<input name="maxcells" type="text" id="maxcells" disabled="disabled" style="text-align:center"></td>
</tr>
</table>
</div>
<div id="apDiv1">
<input type="submit" name="Generate" value="G e n e r a t e"><input type="reset" name="Reset" value="R e s e t">
</div>
</form>
</body>
<script language="JavaScript" type="text/javascript">

</script>
</html>

Selamat mencoba...^_^ Readmore...

Passing By Value Dan Passing By Reference

Pada kesenmpatan ini saya akan membahas mengenai passing argument di PHP. Apa itu PHP? dan apa itu passing argument?

PHP kepanjangan dari Hypertext Preprocessor, PHP sendiri dibuat oleh Rasmus Lerdorf, PHP bersifat open source dan telah digunakan oleh hampir seluruh web developer di seluruh dunia, situs resmi php bisa dikunjungi di www.php.net. Karena sifatnya yang open source dan semakin banyaknya user membuat bahasa pemprogaman ini mengalami perkembangan yang sangat cepat.
Sintak atau strukturnya hampir mirip dengan bahasa pemprogaman C, Java dan Perl sehingga dengan begitu bagi mereka yang sudah mempelajari bahasa tersebut tidak akan mengalami kesulitan, selain itu bagi para pemula yang baru memulai bahasa pemprogaman web rasanya PHP turut diperhitungkan, karena pemanfaatan bahasa PHP tidak hanya sekedar untuk web dan aplikasinya tetapi sudah merambah kedunia desktop windows, namanya yaitu PHP GTK.

Fungsi pass by value dan pass by reference adalah :
• Fungsi adalah subprogram/subrutin program yang terdiri dari sekumpulan perintah yang akan melaksanakan suatu tugas tertentu
• Fungsi memungkinkan program menjadi lebih terstruktur dan juga memudahkan pelacakan kesalahan.
• Menggunakan fungsi akan mempersingkat waktu pemrogram untuk menuliskan sekumpulan perintah yang sama berkali-kali

Sintaks:
function nama_fungsi($arg1, $arg2, .., arg_n)
{
blok pernyataan fungsi
}
Keterangan:
• Nama_fungsi adalah nama yang akan digunakan untuk memanggil fungsi
• $arg1, $arg2, …, $arg_n adalah argumen-argumen (parameter) yang akan disertakan
pada saat pemanggilan fungsi untuk diproses dalam fungsi. $arg dapat berupa tipe data integer, float atau $variabel.
Blok pernyataan fungsi adalah pernyataan-pernyataan yang terdapat dalam apitan tanda
({ }) dimana dikerjakan fungsi untuk tugas tertentu.

Contoh:
&gt?
$x=2+3;
$y=$x+5;
echo "$y
";
$x=2+3;
$y=$x+5;
echo "$y
";
$x=2+3;
$y=$x+5;
echo "$y
";
$x=2+3;
$y=$x+5;
echo "$y
";
?&lt

Jika kita perhatikan kode di atas, maka penjumlahan yang sama berulang-ulang dituliskan dan merupakan pemborosan. Dengan adanya fungsi maka program diatas bisa dibuatkan ke dalam fungsi dan bisa dipanggil beberapa kali.

PASSING BY VALUE
Argumen fungsi yang dilewatkan secara pass by value (default dalam php) berarti
membuat copy dari argumen yang asli sehingga argumen asli tersebut tidak ikut berubah
dengan adanya proses pada fungsi terhadap argumen tersebut.
Secara default, semua nilai yang di-pass masuk atau keluar dari fungsi adalah passing by value, bukan by reference. Ini berarti PHP membuat copian dari nilai original dan nilai copian itulah yang kita akses dan kita manipulasi, bukan nilai originalnya. Dengan begitu bagaimanapun kita mengubah nilai itu, tidak akan mengubah nilai originalnya.
Berikut contoh dari fungsi pass by value :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>passbyvalue</title>
</head>
<body>
<?php
function jumlah($nilai) {
$nilai++;
}
$input=30;
jumlah($input);
echo $input;
?>
</body>
</html>

Simpan dengan nama PassByVal.php dan berikut penjelasannya :
Pada saat fungsi jumlah dipanggil,
jumlah($input);
maka fungsi tersebut akan memasukkan nilai dari variabel $input kedalam argumennya, jadi disini argumen fungsi jumlah adalah 30 (ini adalah nilai aslinya). Selanjutnya PHP meng-copy nilai asli tersebut, kemudian hasil copyan-nya digunakan untuk proses manipulasi fungsi, sedangkan nilai yang asli dibiarkan tidak berubah. Proses manipulasinya sebagai berikut:
$nilai++;
$nilai = $nilai + 1
$nilai = 30 + 1
$nilai = 31
Untuk output,
echo $input;
nilai variabel $input yang diambil disini adalah nilai variabel aslinya, sehingga hasil manipulasi fungsi tadi tidak dipakai, karena bukan nilai asli. Jadi outputnya adalah 30
Berikut hasil tampilan dari passing by value

PASSING BY REFERENCE
Argumen fungsi yang dilewatkan secara pass by reference berarti membawa argumen asli
ke dalam fungsi sehingga argumen asli tersebut akan ikut berubah dengan adanya proses
pada fungsi terhadap argumen tersebut.
Berbeda dengan passing by value yang bersifat mengkopi, passing by reference memberikan nilai aslinya untuk diakses dan dimanipulasi, dengan contoh yang sama seperti diatas, kita akan modifikasi menjadi mekanisme passing by reference.
Untuk mengubah jadi passing by reference, kita hanya cukup menambahkan operator & pada argumennya.
Berikut contoh dari passing by reference :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>passbyreference</title>
</head>
<body>
<?php
function jumlah(&$nilai) {
$nilai++;
}
$input=30;
jumlah($input);
echo $input;
?>
</body>
</html>

Simpan dengan nama PassByRef.php dan berikut penjelasannya:
Sesuai dengan penjelasan passing by reference diatas, nilai yang diakses & dimanipulasi adalah nilai aslinya, dengan begitu hasil manipulasi fungsilah yang gunakan sebagai outputnya, yaitu 31.
Hasilnya seperti gambar di bawah ini

Selamat mencobA... ^_^ Readmore...

Hari ButekZ Sedunia

Tanggal 17 maret 2010, hari ini merupakan hari terbutek sedunia bagiq,he..he..lebay…Udah dalam keadaan g bisa terlalu mendekatkan diri padaNya juga..makin butek dech..G tau kenapa sejak tadi malam mendengar kabar dari seorang Kurnia Mahanani, dia sakit…ntah kenapa serasa duniaku menjadi hampa, kosong, tak berwarna lagi…hingga kuputuskan untuk membatalkan liburanku untuk pergi ke jatim park bersama anak2 offering A. aku mikir seandaenya aku ikut juga aku bakalan g tenang, bakalan g mood, murang-muring g jelas, daripada ntar bkin suasana g enak ma anak2 mendingan g ikut, dan hal yang paling membuatku langsung befikir untuk membatalkan liburan itu, aku kepikiran Kuru…aku g mau libur2 jalan2 senang2 sementara dia dalam keadaan sakit.

Malam…aku g tenang…menghubungi dia enggak mungkin bgt, sama aja dengan mengganggu istirahatnya, ehmm….untung ja da pertandingan Chelsea n inter Milan itu yg bsa mengalihkan pikiranku sejenak, ampe subuh aku sms temennya nanya apakah kuru udah baik2 apa belum?!malah temennya bilang dia g knapa2,,lega sedikit rasanya,,,tapi apa beberapa menit kemudian dia bilang kuru beneran demam, g tau knp rasa khawatirku makin memuncak, aku g tau harus berbuat apa, mau jenguk pagi2 g mungkin bgt..aku sms aja…kuru.. bilang mau masuk kuliah…sempet mikir ntar masih bisa jenguk atau g ngeliat keadaannya sebelum pulang ke pare..

paginya udah nyiepin obat, roti ma air mineral buat jenguk…jam 9 an aku sms kuru lagi katanya kuliah diundur ampe jam setengah dua belas dan mau langsung berangkat…aku makin kacau…aku g bisa ngeliat dia…mungkin setan juga udah dari tadi malem memenjarakan aku..sampai terlintas dibenakku untuk ikut naek angkot bersamanya untuk pergi ke terminal, aku memaksa tapi kuru g ngijinin..ya sudah aku hanya bisa berdoa mudahan dia baik2 aja…dan anehnya lagi entah kenapa aku menangis sesenggukan….tangis yg biasa kini berubah menjadi lebay..untung aja aku hanya sendiri di kos,,jadi g da yang tau,he…he…..

Di tengah2 hati yang gundah temen2ku masih sms, “nov jadi ikut?!”padahal aku sudah sms beberapa orang bilang g ikut, masih aja diajak..aku bilang aku g ikut…dan memutuskan untuk berdiam diri di kos dan g keluar…

Aku makin terlarut …aku g mau sesuatu apapun mengganggu..TV ku matiin, jendela, dan pintu kamar ku tutup rapat…masih aja ada sms yang berbunyi,,hmmm..lagi2 urusan kampus,,,akupun bertekad hari ini akan kujadikan hari merdekaku sedunia untuk tidak berurusan lagi dengan kertas2 g penting itu,he…

Aku makin sesenggukan..akhirnya aku memutuskan untuk membales sms..sms dari temen lamaku..tak terasa aku smsan hingga mau mendekati zuhur…ku lihat jamku, setengah 12, kepikiran kuru lagi…sekitar jam dua belasan kuru pamit mau pulang…akupun makin kalut..berharap dia baek2 aja…pi beberapa saat kemudian dia bilang istirahat dulu di kos,,lega lagi sejenak….mau jenguk g ada temennya…bagaimanapun aku masih punya malu untuk pergi ke kosnya cowok kalo sendiri..

Tak terasa perutku lapar,,kan biasa kalo nangis itu mengeluarkan energi yang banyak,he…aku sms temenku minta tolong kalo pulang sekalian beliin nasi…he..pi da satu hal yang bisa membuatku tertawa getir,,aku sms temennya kuru, “kuru udah mendingan belum?!” eh dibales ma kuru ndiri, “Taman juga lagi sakit perut ney tidur disebelahku” langsung terlintas dibenakku…ehmm..gmn rupanya orang dua itu sama2 meringis,he..he….

Hatiku trus tidak tenang…..dengan kegiatan rutin seperti biasa aku sms lagi, karena kuru g nyampe rumah tepat waktu, takut ada suatu hal terjadi atau apalah..aku g bisa mengendalikan pikiranku…pi Alhamdulillah bentar lagi dia nyampe…

Hpq berdering…dan ternyata Bapak...dengan suara berat aku mengangkat telepon itu, terdengar di ujung sana,”ini ibu mau ngomong”…ibu menanyakan kembali apakah aku baik2 saja?!ternyata ibu masih kepikiran kenapa aku sesenggukan kemarin…aku bilang tiang baik2 saja…..emang aku baik2 saja…mendengar suara itu hati ini sedikit lega…ngomong panjang lebar sudah cukup bisa membuatku tersenyum kembali…seperti biasa setelah ibu giliran kakakku yang ngobrol panjang lebar,,biasa g jauh2 mbahas seputar sekolahnya dan apa saja kegiatanku di sini…dan seperti biasa suara rame dari ketiga keponakanku membuatku tambah lega….,suara rengekan manja dari keponakanku yang paling bungsu”bi’ boneka kalo pulang”..ehmm,”enggih, yang penting "Dah" mau jemput bibi’ kalo pulang,he..he…karena biasanya baik dianter menuju malang ataupun pulang kampung mesti satu rombongan ikut semua, bahagia rasanya membayangkan akan hal itu…seperti biasa aku tidak pernah bicara panjang lebar dengan bapak, karena aku lebih dekat dengan ibu....akhir pembicaraan seperti biasa ibu dan bapak..slalu mengingatkanku untuk menjaga diri baik2….maafkan aku ibu..bapak…jika anakmu sudah berbuat salah..T_T…Luv u alL…telpon ditu2p karena di kampung halamanku sana azan sudah menggema….

Di hpku ternyata ada sms masuk, temenku ngajak nonton dance (dancernya temen2 PTI) di anfak..q nolak masih g mood…tapi sudah sedikit tidak kepikiran lebay lagi….karena kuru udah di rumah bersama keluarganya tercinta..^_^.. aku sudah bosan berdiam diri di kos dan g keluar2 sama sekali..hingga aku memutuskan untuk jalan2 aja sebentar sekedar menghirup udara luar….cuman sebentar….balik lagi ke kos…nanya kabar kuru..lumayan udah mendingan…mudah2an tambah baikan aja Ru..muk kangenm!!!!
^_^ Readmore...

Love Inspired By Ketika Cinta Bertasbih

Sekalipun CINTA telah ku uraikan
dan kujelaskan panjang lebar
namun jika CINTA kudatangi
aku jadi malu pada
keteranganku sendiri..

Meskipun lidahku telah mampu menguraikan
namun tanpa lidah
CINTA ternyata lebih terang..
sementara pena begitu tergesa-gesa menuliskannya
kata-kata pecah berkeping-keping
begitu sampai kepada CINTA..

Dalam menguraikan CINTA
akal terbaring tak berdaya
bagaikan keldai terbaring dalam lumpur..
CINTA sendirilah yang menerangkan CINTA dan percintaan..

Ketika cinta bertasbih
Bergetarlah seluruh rasa dalam jiwa
Indah dalam resonansi kasih sayang

Ketika cinta berdzikir
Berguncanglah alam
Syahdu dalam alunan nada cinta

Ketika ayat-ayat cinta terkumandangkan
Sirna sudah segala kebencian
Musnah sudah segala dendam
Jauh sudah segala dengki
Yang mengotori kebeningan cerminan hati

Lalu diatas sajadah cinta
Sujudlah seluruh raga
Menundukkan hati dan jiwa
Menanti datangnya masa…
Cinta berbuah surga

CINTA adalah KEKUATAN yang mampu
mengubah duri jadi mawar
mengubah cuka jadi anggur
mengubah malang jadi untung
mengubah sedih jadi riang
mengubah setan jadi nabi
mengubah iblis jadi malaikat
mengubah sakit jadi sehat
mengubah kikir jadi dermawan
mengubah kandang jadi taman
mengubah penjara jadi istana
mengubah amarah jadi ramah
mengubah musibah jadi muhibbah
itulah CINTA.... Readmore...

Novi G Tau Malu

Inilah kegejeanQ.....kisah cintaQ....
yang tlah kutulis sejak kurang lebih 4 bulan yang lalu....
cerita yang seharusnya kuperuntukkan untuk teman2q tersayang..pi gpp di upload,he..he..
ancen Novi Gueje puoll....
bagi yang mau baca..sialhkan Klik Di sini Readmore...

Aplikasi Kalkulator dan Form Pemesanan dengan Java Script

Java Script
Sebelum membuat program kalkulator ataupun form pemesanan hendaknya terlebih saya akan mendeskripsikan sedikit hal tentang java script

Pada Java Script tipe data yang dimiliki diantaranya :
1.String contohnya : "khassifa"
2.Number/Integer contohnya 7702
3.Boolean : suatu variabel yang mempunyai dua nilai untuk memeriksa suatu kondisi tertentu yakni true untuk menyatakan kondisi benar ; false untuk menyatakan kondisi salah contohnya
Variabel
Pada javascript kita sering menjumpai variabel-variabel, adapun fungsi dari variabel itu merupakan suatu objek yang berisi data, yang dapat dimodifikasi selama pengeksekusian program
Aturan penulisan variabel pada javascript. Nama variabel harus dimulai oleh huruf (huruf besar maupun huruf kecil) atau satu karakter ''_''. Nama variabel bisa terdiri dari huruf, angka atau karakter _ dan & (spasi kosong tidak diperbolehkan).
Nama variabel tidak boleh memakai nama nama berikut ini (reserved oleh program) :
abstract
boolean break byte
case catch char class const continue
debugger default delete do double
else export extends
false final finally float for function
goto
if, implements, import, in, infinity, instanceof, int, interface
label, long new, null
package, private, protected, public
return
short, static, super, switch, synchronized
this, throw, throws, transient, true, try, typeof
var, void, volatile
while, with

Berikut merupakan contoh penggunaan variabel pada sebuah contoh sederhana pada code HTML :

<html>
<head>
<title>Data Types and Variables</title>
</head>
<body>
<script type="text/javascript">
var x, y;
x= 1024;
y=x; x = "Test";
document.write("<p>x = " + y + "</p>");
document.write("<p>x = " + x + "</p>");
</script>
</body>
</html>

**Hasil dari pengeksekusian code diatas :
X=10
X=Test
Peletakan variabel (global atau lokal)
Variabel global adalah variabel, dimana variabel itu bisa di akses dari seluruh bagian program.
Variabel lokal adalah variabel, dimana variabel itu tidak bisa di akses dari seluruh bagian program yaitu hanya berlaku untuk fungsi tertentu .
Contoh dari penggunaan variabel Global :

<SCRIPT language="Javascript">

</SCRIPT>

Dari contoh diatas, variabel a dideklarasikan secara eksplisit di awal dari skrip program dan juga di deklarasikan di dalam fungsi . berikut ini hasil dari program diatas.
Berikut contoh penggunaan variabel lokal:

Dua kali dari 4 adalah 8
Nilai dari a adalah 12

<SCRIPT language="Javascript">

</SCRIPT>

Berikut ini hasil dari program diatas.
Dua kali dari 4 adalah 8
Nilai dari a adalah 8

Berikut adalah contoh aplikasi kalkulator sederhana menggunakan JavaScript :

Source code html dan java scriptnya adalah

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head><title>Kalkulator Sederhana</title></head><body>

<script language="JavaScript" type="text/javascript">



</script>

<form name="form1" action="#">

<input name="x" type="text">

<select name="opt">

<option value="tambah"> + </option>

<option value="kurang"> - </option>

<option value="kali"> * </option>

<option value="bagi"> / </option>

</select>

<input name="y" type="text">

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

<input name="hasil" disabled="true" type="text"><br>

<input value="CLEAR" onclick="resetForm()" type="button">

</form>

</body></html>

Untuk aplikasi lanjut dengan menggunakan java script dapat dibuat sebuah form pemesanan seperti pada gambar di bawaha ini

source code html dan java scriptnya adalah

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title>Form Pemesanan Kedai Khassifa</title>

</head>

<body>

<script language="JavaScript" type="text/javascript">



</script>
<h3>Form Pemesanan Berbasis JavaScript</h3>

<form name="form2" action="#">

<table border="1px">

<tr>

<th>No</th>

<th>Makanan/Minuman</th>

<th>Harga</th>

<th>Pesan</th>

</tr>

<tr>

<td width="15px">1</td>

<td width="200px">Bakso Istimewa</td>

<td width="85px" bgcolor=>@<input type="text" name="bakso" value="12000" size="6" disabled="true"/></td>

<td width="150px"><input type="text" name="qBakso" value="0" onChange="hitungPesan()"/></td>

</tr>

<tr>

<td>2</td>

<td>Soto Spesial</td>

<td bgcolor=>@ <input type="text" name="soto" value="10000" size="6" disabled="true"/></td>

<td><input type="text" name="qSoto" value="0" onChange="hitungPesan()"/></td>

</tr>

<tr>

<td>3</td>

<td>Mie Ayam Super</td>

<td bgcolor=>@ <input type="text" name="mie" value="15000" size="6" disabled="true"/></td>

<td><input type="text" name="qMie" value="0" onChange="hitungPesan()"/></td>

</tr>

<tr>

<td>4</td>

<td>Es Degan</td>

<td bgcolor=>@ <input type="text" name="degan" value="7000" size="6" disabled="true"/></td>

<td><input type="text" name="qDegan" value="0" onChange="hitungPesan()"/></td>

</tr>

<tr>

<td>5</td>

<td>Es Campur</td>

<td bgcolor=>@ <input type="text" name="campur" value="7000" size="6" disabled="true"/></td>

<td><input type="text" name="qCampur" value="0" onChange="hitungPesan()"/></td>

</tr>

<td colspan="3" align="right">Jumlah Total</td>

<td><input type="text" name="Total" disabled="true" /></td>

</tr>

<td colspan="3" align="right">Diskon</td>

<td><input type="text" name="Diskon" disabled="true" /></td>

</tr>

<td colspan="3" align="right">Jumlah Dibayar</td>

<td><input type="text" name="Bayar" disabled="true" align="right"/></td>

</tr>

</table><br/>

<input type="button" value="BATAL" onClick="resetForm()" />

</form>

<br>
<marquee><font color="red" face="Arial Black" size="5">by : Novi Khassifa</marquee></font><br>
</FORM>
</CENTER>

</body>

</html>

selamat mencoba..^_^.. Readmore...

Membuat Tabel dengan css

Pada bahasan sebelumnya kita membuat tabel melalui cara manual, yaitu dengan mengetikan sintaknya, nah... kali ini kita akan belajar membuat tabel dengan CASCADING STYLE SHEET atau yg lebih populer disebut css, adapun deskripsi dari css yaitu,
Cascading style sheet (CSS) merupakan sekumpulan aturan yang menyatakan bagaimana style diaplikasikan ke tag-tag HTML di dalam dokumen.
Rekomendasi CSS menguraikan tiga jenis style:

Embedded : properti style diletakkan di dalam satu blok di dokumen HTML.
Inline : properti style diterapkan secara langsung per baris atau per elemen HTML.
Linked : properti style diletakkan di file berekstensi css dan dikaitkan dengan dokumen HTML.

Selain mengulas tentang pemanfaatan CSS, bagian ini juga menekankan pada pembuatan desain dengan menggunakan division. Bagaimanapun, untuk menghasilkan desain halaman web yang baik, penggunaan tabel tidak disarankan dan sebagai gantinya adalah dengan memanfaatkan division.
Contoh pemanfaatan css:
Dalam contoh ini kita akan belajar mengimplementasikan ccs.
contohnya seperti tabel layout dari wab di bawah ini
Supaya menghasilkan seperti tabel tersebut langkah pertama tuliskan script berikut pada note pad dan simpan dengan format . html
adapun source codenya...

<!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" xml:lang="en" lang="en">
<head>
<title>Format Layout Sederhana</title>
<link rel="stylesheet" href="FormatStyle.css" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="header">
Header
</div>
<div id="inner">
<div id="sidebar">
Sidebar
</div>
<div id="top">
Top
</div>
<div id="content">Content
</div>
<div id="right">
Right
</div>
</div>
<div id="footer">
Footer
</div>
</div>
</body>
</html>

Langkah kedua setelah kita menuliskan kode tersebut buat kerangka atau link yang nantinya dapat terhubung dengan kode program di atas dan simpan dengan namafile.css

#wrapper {
margin: auto;
width: 750px;
border: 1px solid red;}
#header {
height: 85px;
border: 1px solid blue;}
#inner {
float: left;
margin: 5px 0;
border: 1px solid black;}
#sidebar {
float: left;
margin-right: 20px;
width: 200px;
height: 357px;
border: 1px solid red;}#top {
float: left;
width: 524px;
height: 120px;
border: 1px solid red;}
#content {
float: left;
margin-right: 20px;
width: 275px;
height: 235px;
border: 1px solid green;}
#right {
float: right;
width: 227px;
height: 180px;
border: 1px solid red;}
#footer {
clear: both;
height: 75px;
border: 1px solid blue;}

dari pembuatan tabel di atas kita bisa mengembangkannya dengan mengganti background ataupun menambah foto,melink-kan,dan lain2 seperti pada gambar di bawah ini

adapun sourcodenya html dan cssnya adalah sebagai beikut...

==>sourcecode html
<!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" xml:lang="en" lang="en">

<head>
<title>Desain Layout Sederhana</title>
<link rel="stylesheet" href="NoviStyle.css" type="text/css" />
</head>

<body>
<div id="wrapper">
<div id="header">
<div id = "box1">
<img src="logo um.gif">
</div>
<div id="logo">
<img src="logo um.jpg" width="50"/>
</div>
<div id="site-title">
<h2>TEKNIK ELEKTRO</h2>
</div>
<div id="search">
Search : <input name="q" size="20" type="text"/>
</div>
<div id = "box2">
<a href="LinkEmail.html"> <font color="black">FTE</a></p>
</div>
<div id = "box3">
<a href="LinkBalik.html"><font color="black">Profile</a></p>
</div>
<div id = "box4">
<a href="LinkHome.html"><font color="black">Home</a></p>
</div>
</div>

<div id="inner">
<div id="sidebar">
<div id="leftmenu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">News and Media</a></li>
<li><a href="#">Article</a></li>
<li><a href="#">Tutorials</a></li>
<li><a href="#">Tips and Tricks</a></li>
</ul>
</div>
</div>
<div id="top">
<div id = "box8">
<img src="2.jpg">
</div>
<div id = "box9">
<img src="3.jpg">
</div>
</div>
<div id="content">
<b>Himpunan Mahasiswa Elektro<br/></b>
<br/>
A. Visi <br/>
Sebagai wadah pengembangan dan pembinaan kemahasiswaan diprioritaskan untuk meningkatkan kompetensi dalam bidang penalaran/keilmuan, minat
dan kegemaran mahasiswa, kesejahteraan mahasiswa, kepedulian sosial kemasyarakatan, serta organisasi kemahasiswaan di lingkup jurusan teknik elektro<br/>

<br/>
Read more......</br>

</div>
<div id="right">
<b>Event :</b>
<ul>
<li><a href="#">Seminar Nasional Teknologi</a></li>
<li><a href="#">Pelatihan Karya Tulis Ilmiah</a></li>
<li><a href="#">Kajur Cup Elektro</a></li>
<li><a href="#">Gelar Sains Elektro (GENIE)</a></li>
</div>
</div>
<div id="footer">
<h3 align="center"><b>© HIMPUNAN MAHASISWA ELEKTRO FAKULTAS TEKNIK UM.</b></h3>
</div>
</div>
</body>
</html>

==>sourcecode css

#wrapper {
margin: auto;
width: 1000px;
border: 1px solid white;
}
#header {
height: 100px;
background: #99CC00;
border: 1px solid white;
}
#inner {
float: left;
margin: 3px 0;
border: 1px solid white;
}
#sidebar {
float: left;
margin-right: 5px;
width: 175px;
height: 357px;
background: #CCFF99;
border: 1px solid white;
}

#top {
float: left;
width: 813px;
height: 135px;
background: #FFFFCC;
border: 1px solid white;
}

#content {
float: left;
margin-right: 5px;
width: 450px;
height: 240px;
background: #FFFFCC;
border: 1px solid white;
text-align:justify;
}

#right {
float: right;
width: 357px;
height: 165px;
background: #CCFF99;
border: 1px solid white;
}

#footer {
clear:both;
height: 50px;
background: #6cae15;
border: 1px solid white;
}

#leftmenu ul {
width: 175px;
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: #6cae15 no-repeat left center;
margin: 0px 0px 1px; color: #ffffff;
}
#leftmenu a:hover {
background: #5e9711 no-repeat left center; color: #ffffff
}

#box1 {
float: left;
margin-right:10px;
width: 91px;
height: 98px;
background: #FFFFFF;
border: 1px solid white;
}

#box2{
float: right;
margin-right: 20px;
margin-top: 7px;
width: 60px;
height: 20px;
background: #99CC00;
border: 1px solid #99CC00;
}

#box3{
float: right;
margin-right: 5px;
margin-top: 7px;
width: 35px;
height: 20px;
background: #99CC00;
border: 1px solid #99CC00;
}

#box4{
float: right;
margin-right: 5px;
margin-top: 7px;
width: 32px;
height: 20px;
background: #99CC00;
border: 1px solid #99CC00;
}

#site-title h2{ float:left; padding:0px 10px; height:30px; margin:20px 0px; font:2.1em/100% 'Verdana'; font-weight: bold;}
#search { clear:right; float:right; margin:20px 50px 0px auto; height:30px; font-weight:bold;}

#box6{
float: right;
margin-right: 5px;
margin-top: 7px;
width: 50px;
height: 20px;
background: #99CC00;
border: 1px solid #99CC00;
}

#box7 {
float: left;
margin-right: 5px;
margin-top: 2px;
width: 490px;
height: 85px;
background: #FFFFCC;
border: 1px solid #FFFFCC;
}
#box8 {
float: left;
margin-right: 3px;
margin-top: 5px;
width: 406px;
height: 110px;
background: #FFFFCC;
border: 1px solid #FFFFCC;
}
#box9 {
float: left;
margin-right: 0px;
margin-top: 5px;
width: 400px;
height: 110px;
background: #FFFFCC;
border: 1px solid #FFFFCC;
}

Selamat mencoba...^_^ Readmore...

KhassifaELek Go-Blog

KhassifaNdutZ's Clock

KhassifaNdutZ's Calender

Convert HTML Code

Category

Gabung yuk!

Join in my Blog!

Blognya temen2

Facebook NdutZ

Cari Blog Ini

Jadwal Perempat Final Liga Champion 2010

Perempat Final Liga Champion

Membuat Tabel Fleksibel dengan PHP

Passing By Value Dan Passing By Reference

Hari ButekZ Sedunia

Love Inspired By Ketika Cinta Bertasbih

Novi G Tau Malu

Aplikasi Kalkulator dan Form Pemesanan dengan Java Script

Membuat Tabel dengan css

The ReaL GeJe ^^

KHASSIFA SI BINTU NAHL

LaguQ

Wonder Woman 4ever

Blog DosenQ

"INTAP-INTIP"

Blog Archive

Komentar Terbaru

Komentar

WARNING! >_

About Me

Tags Cloud

BlogUp