Saatnya bernarsis ria! Hehe....
Disimpan dengan nama bibi2.html.
Agak rumit ya? Gak papa kok, asal diikuti dengan baik, pasti berhasil. Silahkan anda mencoba dirumah. Jika ada kesulitan atau kegagalan, silahkan hubungi saya lewat blog ini atau e-Mail saya ya.
Kenapa aku bilang begitu? Karena sekarang kita akan mencoba membuat sebuah perintah untuk membuat sebuah album poto. Bagi yang dasarnya narsis, ini ajang pamer diri dan wajib mencoba tag yang aku pelajari ini walaupun sederhana sih. Hehe.....
Baiklah, kembali ke html. Untuk membuat sebuah album poto, pertama-tama kita tentukan dulu poto mana yang akan kita masukkan. Setelah selesai milih, letakkan poto tersebut didalam sebuah folder, dan beri nama sesuka hati anda. Untuk percobaan ini, aku memakai 3 buah potoku. Setelah itu barulah kita membuat link album kita. Link album contoh:
<html>
<body bgcolor="white">
<p><font size="6" color="blue">Album Bibi</font></p><br>
<a href="bibi.html"><img src="bibi.jpg" width="200" height="320"></a>
<a href="bibi1.html"><img src="bibi1.jpg" width="200" height="320"></a>
<a href="bibi2.html"><img src="bibi2.jpg" width="200" height="320"></a>
</body>
</html>
Jangan lupa disimpan dengan nama Album.html. Hasilnya adalah:
Oke, sekarang album sudah jadi. Biasanya sih sampai disini saja sudah cukup, namun jika kita ingin melihat potonya 1 persatu dengan men-klik salah satu poto di dalam album, kita bisa mengetik tag:
Untuk gambar sebelah kiri:
<html>
<body bgcolor="white">
<a href="album.htm"></a>
<p><font size="6" color="blue" face="jokerman">Bibi</font></p><br>
<img src="bibi.jpg" width="300" height="400"><br><br>
<a href="bibi2.html">previous</a>
<a href="bibi1.html">next</a>
</body>
</html>
Disimpan dengan nama bibi.html. Hasil dari tag diatas adalah:
Seperti hasil diatas, yang terlihat adalah gambar sebelah kiri (kita bilang aja namanya gambar 1 ya, gambar 2 tuk gambar tengah dan gambar 3 untuk gambar kanan). Untuk melihat gambar lainnya cukup mengklik tombol next dan previous yang ada di bawah gambar 1. Lihat kembali tag yang kita buat tadi. Jika kita men-klik tombol next, maka akan muncul gambar 2 dan jika men-klik previous maka akan muncul gambar 3.
Untuk bisa melakukan hal yang sama dengan poto lainnya, maka kita juga harus membuat link untuk poto yang lainnya. Tagnya hampir sama dengan poto diatas, namun ada bedanya yaitu pada:
- img src diganti dengan nama poto yang lain beserta formatnya
- Untuk previous, ganti link potonya dengan link poto sebelah kirinya dan begitu juga sebaliknya dengan next.
poto yang ditengah:
<html>
<body bgcolor="white">
<a href="album.htm"></a>
<p><font size="6" color="blue" face="jokerman">Bibi</font></p><br>
<img src="bibi1.jpg" width="300" height="400"><br><br>
<a href="bibi.html">previous</a>
<a href="bibi2.html">next</a>
</body>
</html>
Disimpan dengan nama bibi1.html dan untuk poto yang kanan:
<html>
<body bgcolor="white">
<a href="album.htm"></a>
<p><font size="6" color="blue" face="jokerman">Bibi</font></p><br>
<img src="bibi2.jpg" width="300" height="400"><br><br>
<a href="bibi1.html">previous</a>
<a href="bibi.html">next</a>
</body>
</html>
Disimpan dengan nama bibi2.html.
Can't wait for next posting..... ;)