Make your own free website on Tripod.com

Bagaimana Membina `Frames' [Bingkai] di dalam HTML.

Saya akan menggunakan halaman Tn. Hj. Baharam Azit sebagai contoh kita membuat laman web berbingkai.


Kita perhatikan kod-kodnya di fail utama yang menggabung kedua-dua fail iaitu fail baha.html di sebelah kiri dan fail baha1.html di sebelah kanan. Sementara fail keseluruhan ini dipanggil fail index.html

Oleh itu, sekurang-kurangnya  3 fail html yang perlu dibina untuk homepej berbingkai. Di dalam contoh di atas, fail-fail tersebut ialah, baha.html, baha1.html dan index.html sebagai fail keseluruhan.

Berikut ialah kod bagi index.html (dengan andaian fail baha.html dan baha1.html telah siap untuk digunakan):-

<HTML>

<HEAD>
<TITLE>Baharam's Home Page</TITLE>
</HEAD>

<FRAMESET COLS="25%,75%" BORDER="0">
   <FRAME SRC="baha.html">
   <FRAME SRC="baha1.html" NAME="WINDOW-1">

</FRAMESET>

<NOFRAMES>
<body bgcolor="white" text="black">
<H2>YOUR BROWSER DOES NOT SUPPORT FRAMES</H2>
<BR>
<H2><i>[Browser anda tidak boleh digunakan untuk melihat FRAMES]</i></H2>
</NOFRAMES>
</HTML>


Tag pertama yang perlu diletakkan ialah <FRAMESET>. Ini akan memberitahu browser untuk memuatkan dokumen berbingkai. Ciri-ciri untuk tag <FRAMESET> ini ialah COL. Tag ini menentukan dimensi-dimensi (ukuran) bingkai-bingkai.

<FRAMESET COLS="25%, 75%">

Dua baris selanjutnya ialah, <FRAME SRC=" "> yang menentukan dokumen yang akan dimuatkan. Fail "baha.html" akan dimuatkan di dalam bingkai yang kecil manakala fail "baha1.html" akan dimuatkan di bingkai utama yang bernama "WINDOW-1".

<FRAME SRC="baha.html">

Perhatikan ada arahan untuk fail-fail yang diklik di bingkai kecil (baha.html) supaya ianya dipaparkan di WINDOW-1 (bingkai besar).

<FRAME SRC="baha1.html" Name="WINDOW-1">

</FRAMESET>
Tag ini mengakhiri FRAMESET.

Apa pula terjadi jika seseorang itu menggunakan browser yang tidak berkebolehan membaca dokumen berframe? Inilah tujuan mengapa <NOFRAMES> dan </NOFRAMES> dicatitkan. Oleh itu ia masih mengizinkan para pelayar untuk melihat dokumen anda namun tanpa menggunakan bingkai.

Sekarang kita tinjau pula di dalam fail di sebelah kiri iaitu fail baha.html

 
<HTML>
<HEAD>
<TITLE>BAHA</TITLE>
</HEAD>
<BODY>
<P>Anda boleh melawat fail ini<A HREF="baha1.html" TARGET="WINDOW-1">Percubaan Bingkai</A>
</BODY>
</HTML>

Itu saja sementara bina pula fail di sebelah kanan, dan namakannya nanti sebagai baha1.html
<HTML>
<HEAD>
<TITLE>BAHA1</TITLE>
</HEAD>
<BODY>
<PRE>PERCUBAAN

Seandainya anda berjaya sampai ke halaman ini, 
ini berarti anda sedang mencuba bagaimana
dokumen-dokumen bertukar di bingkai utama ini 
dengan mengklik pada tajuk-tajuk di dalam
daftar isi yang terkandung di bingkai sebelah. 

Sekarang anda tekan butang BACK di browser anda 
untuk kembali ke halaman asal atau klik saja
pada tajuk yang anda ingini di bingkai sebelah kiri atau
</PRE>

</BODY>
</HTML>

SELAMAT MENCUBA


 
Pel 1 Pel 2 Pel 3 Pel 4 Pel 5 Pel 6 Indeks
TUTORIAL ASAS HTML

[Tutorial Jadual] [Tutorial Borang] [Tutorial Bingkai] [Tutorial Pemetaan Imej]
[Java & Javaskrip] [Muzik Latarbelakang] [Sumber Lain]

ZULKIPLY HARUN'S ONLINE PORTFOLIO