Pemrograman Web : Modul 4. Membuat Menu Left |

Pemrograman Web : Modul 4. Membuat Menu Left

Posted on January 19, 2010 by ahmadrizal

Modul 4. Membuat Menu Left
Ahmad Rizal Abidin, M.Kom

Menu Left, merupakan tampilan dari web yang dipergunakan untuk meletakkan control dari isi web, menu ini akan selalu tampil pada saat web di tampilkan. Adapun langkah-langkah membuatnya adalah :
1. Membuat Background dengan menggunakan Macromedia Flash 8, dengan bentuk gambar seperti berikut :
Gambar 1. Background Menu Left

Dari gambar di atas memiliki ukuran atau dimension = 150 widht x 400 px height, menggambarnya menggunakan Rectangle tool, dan rubahlah warna sesuai dengan keiinginan, setiap gambar terletak pada layer yang berbeda-beda. Simpanlah gambar tersebut dengan cara mengekspor dengan nama lefback.png pada folder flash. Dan folder tersebut terletak pada folder web yang akan dibuat.
2. Langkah selanjutnya adalah menyiapkan animasi dengan menggunakan Flash delapan seperti gambar berikut :
Gambar 2. Animasi Menu

Dari gambar di atas memiliki ukuran atau dimension = 120 widht x 50 px height, menggambarnya menggunakan Rectangle tool kotaknya, dan textool untuk tulisan adapun animasinya menggunakan Mask dan rubahlah warna sesuai dengan keiinginan, setiap gambar terletak pada layer yang berbeda-beda. Simpanlah gambar tersebut dengan cara mengekspor dengan nama tommenu.swf pada folder flash. Dan folder tersebut terletak pada folder web yang akan dibuat.a

3. Langkahnya selanjuntya adalah mengetikkan tag pada notepad dan simpan dengan nama leftmenu.html, adapun tagnya adalah seperti berikut :


<html>
<head>
<title>New Page 2</title>
<base target="main">
</head>
<body  background ="flash/lefback.png" BGCOLOR="#99999">
<Table border=1 width="120" height="10">
<tr>
<td>
<center><embed  src="flash/tomMENU.swf" 
	width="120" height="50"></embed>
</tr>
</td>
<tr>
<td>
<br>
<a href="home.htm">
<b><font color=#0000ff size="4">Home</font></b> </a>
</tr>
</td>
<tr>
<td>
<br> 
<a href="home.html">
<b><font color=#0000ff size="4">Shoping</font></b></a>
</tr>
</td>
<tr>
<td>
<br> 
<a href="home.html">
<b><font color=#0000ff size="4">DownLoad</font></b></a>
</tr>
</td>
<tr>
<td>
<br> 
<a href="home.html">
<b><font color=#0000ff size="4">Contact Us</font></b></a>
</tr>
</td>
<tr>
<td>
<br> 
<a href="home.html">
<b><font color=#0000ff size="5">Ebout Us</font></b></a>
</tr>
</td>
</table>
</body>
</html>

@Ahmad
Selamat Mencoba…

Materi Yang berhubungan :
Modul 7.
Modul 6.
Modul 5.
Modul 4.
Modul 3.
Modul 2.
Modul 1.