Manipulasi Javascript 2

Pada kesempatan kali ini saya akan mencoba untuk menlanjutkan tutorial "manipulasi javascript" yang pernah saya ungkapkan. pembahasan kali ini mengunakan taktik yang sama namun penyelesaian yang sama. saya masih mengunkan kolaborasi antara Javascript, HTML dan CSS. dimana javascript menjadi Controller, HTML menjadi View dan CSS sebagai Model. saya akan menampilkan output dari tutorial yang saya maksudkan :

Halaman 1	Halaman 2	Halaman 3	Halaman 4	Halaman 5
Ini adalah halaman 1 Ini adalah halaman 2 Ini adalah halaman 2 Ini adalah halaman 3 Ini adalah halaman 3 Ini adalah halaman 3 Ini adalah halaman 4 Ini adalah halaman 4 Ini adalah halaman 4 Ini adalah halaman 4 Ini adalah halaman 5 Ini adalah halaman 5 Ini adalah halaman 5 Ini adalah halaman 5 Ini adalah halaman 5

Ya benar, output di atas merepresentasikan menu. yang unik adalah, halaman dapat load dengan cepat, dengan content yang berbeda-beda, sebenarnya pada awal kita meload halaman ini, semua halaman telah terload juga, namun tidak di tampilkan. sudah mengerti jalannya program? mari saya jelaskan satu persatu. sebenernya lagi-lagi saya mengunakan sistem layer, yang saya sembunyikan dan tampilkan sesuai dengan yang user kehendaki. untuk masalah hidden dan show layer bisa di lihat pada penjelasan tutorial sebelumnya. namun bila belum mengerti silakan tanyakan bagian mana yang belum Anda mengerti. dengan demikian yang membedakan adalah di Javascriptnya, demikian source javascriptnya :

<script language="JavaScript">

function buka(id) {
 a = parseInt(id); // conver menjadi integer
 var n = 5; // untuk menandakan banyak halaman.
 for(i=1;i<=n;i++) {
  if (i == a)
    document.getElementById("hal_" + i).style.display = "";
  else
    document.getElementById("hal_" + i).style.display = "none";
 }
}

</script>

logikanya sederhana, kita hanya perlu meperlihakan layer yang di pilih, selainnya di sembunyikan. misalnya kita hendak menampilkan halaman 3, maka kita sembunyikan halaman 1, 2, 4, dan 5. maka yang telihat hanyalah layer ke 3 (halaman ke 3).
simpel bukan?
Selamat mencoba 

Facebook