TrustWeb

Membuat Efek Peel (Lekukan Halaman)

Mungkin Anda sudah pernah mendapati sebuah website yang memakai efek ini di pojok halamannya. Efek ini memberi kesan seolah-olah ada halaman lain yang sedikit terlihat dibelakang halaman yang sedang diakses. Seperti sebuah buku. Kalai belim tahu, ini lho yang saya maksud. Klik disini.

Cara membuatnya mudah. Ikuti langkah ini:
1. Kita akan memakai layanan dari pihak ketiga saja biar mudah. Kunjungi http://www.123-banner.com/
2. Pilih "Peel Banner"
3. Scroll jendela kebawah, klik "Choose Banner"
4. Klik "Browse" untuk mengambil gambar banner dari komputer Anda, dalam hal ini yang berformat JPG atau PNG. Klik "Upload"
5. Isilah "Small corner text:" dengan teks yang akan terlihat di (seolah-olah) halaman berikutnya, "Main text:" dengan teks yang akan terlihat waktu mouse diarahkan, "Backside text:" untuk teks yang akan terlihat dibalik lipatan" dan isilah "URL" dengan alamat website atau blog Anda. Pilih warna teks dan background. Klik "Submit Query"

6. Ambil Banner Peel dengan klik kanan "Click your right mouse here
to save the banner", pilih "save link as" pada menu short cut untuk menyimpan di kompiter Anda.
7. Sekarang upload file swf yang Anda peroleh tadi ke sebuah server web seperti geocities, tripod, atau yang lainnya.

8. Sekarang buka akun blogger Anda, pilih "Tata Letak", "Edit HTML"
9. Cari kode <body>, taruh kode ini dibawahnya
<style type="text/css">
#peel { position:absolute; top:0px; right:0px; width:480px; height:480px; z-index:99; }
</style>
<div id="peel"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://active.macromedia.com/flash8/cabs/swflash.cab#version=8,0,0,0"
id="name" width="480" height="480">
<param name="movie" value="http://www.geocities.com/miracle34x/123-banner-com-30655.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<embed name="name" src="http://http://www.geocities.com/miracle34x/123-banner-com-30655.swf"
quality="high" wmode="transparent" width="480" height="480"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?
P1_Prod_Version=ShockwaveFlash">
</embed>
</object> </div>

10. Ganti kode yang berwarna merah dengan letak file Anda sendiri. Angka 480 untuk high ataupun width bisa Anda rubah sesuka hati Anda. Sebaiknya Anda gunakan kode yang saya berikan diatas walaupun di 123-banner.com sudah disediakan (namun kurang pas untuk blogger)
Selesai. Bagaimana tampilan blog Anda sekarang?

Baca juga artikel yang berhubungan:



7 komentar:

  Cebong Ipiet

10 Desember 2008 23.26

wow...akhirnyaaa hihiihh kalo dulu mah cuman liat yg di wordpress nyoba ah, makasi ya

  Cebong Ipiet

10 Desember 2008 23.53

antox emang kereeeeeeeeeen sudah kucoba hohohoohoho

  Cebong Ipiet

10 Desember 2008 23.54

eh kalo pas di klik nge link ke blog yg kita pengen gmn caranya

  Cebong Ipiet

10 Desember 2008 23.57

waaaaa bruuan di jawab

  ciK aMoi

10 Maret 2009 08.29

thanks!
udah coba di blog ku!

  YUSRON BLOG

11 Mei 2009 03.28

terima kasih banyak

  schwarzkophf.co.cc

1 Juni 2009 03.53

Wow...
Nice tutorial ..
Thanks for share !

Posting Komentar

Rekomendasi

Blogadr.com - Listed (add your blog to Blogadr.com) Blogadr.com - Listed (add your blog to Blogadr.com) Internet Top Blogs Blog Review TopOfBlogs Blog DirectoryBlog Directory Directory of Internet Blogs business blog berburu dolar http://wendh4.blogspot.com/ ihsan's blog ngemprut fauzie's blog Photobucket