Membuat Halaman blog seolah tergulung dan melipat

Tutorial cara membuat halaman blog seolah tergulung dan melipat sepertinya sudah banyak diulas oleh banyak sahabat blog. Salah satunya diantanya adalah blog dari milik sahabat kami Geliat Bisnias.

Yup,hanya untuk yang 'belum tahu' tutorial ini kami publikasikan,adalah membuat ujung bagian kanan atas dari blog tersebut seolah menggulung dan terbuka (bahasa jawanya 'ngletek' mentang2 orang jawa pen-) saat mouse diletakkan diatasnya.Jadi bisa sobat lihat sekali lagi dari blog milik sahabat saya tersebut dan coba letakkan mouse berada diatasnya,maka nanti akan ada efek menggulung alias nglotok seolah blog tersebut memiliki dua kulit

Para programmer menamakan sebagai 'Page Peel',seperti pada tutorial-tutorial beberapa waktu lalu,menggunakan jQuery untuk blogger masih banyak diminati,sekedar flasback teknik jQuery pernah kami gunakan dalam membuat menu jQuery,membuat slideshow jQuery,membuat TabView jQuery dan popup jQuery dan masih banyak lagi yang sobat bisa lihat di Tutorial jQuery pada blog ini.

Nah,bagaiaman jika jQuery dikombinasikan dalam membuat PagePeel ini?

Saya kira dari gambaran yang ga pernah jelas seperti diatas sudah dapat sobat bayangkan tutorial apa yang ingin disampaikan kali ini.


1. Pertama,sobat pergilah ke Dashboard lalu pilih Tata Letak kemudian contreng tulisan Expand Widget Templates,dan cari kode berikut (Gunakan Ctrl+F):

2. Letakkan kode dibawah ini tepat dibawah kode <head> tersebut.


<script type="text/javascript">var tujuan ='http://geliat-bisnis.blogspot.com/'</script>
<script src="https://sites.google.com/site/pujiantoroinc/Home/pagepeelpelajaranblog.js" type="text/javascript"></script>



3. Simpan dan sobat bisa lihat hasilnya


Untuk costomnya sobat utak-atik sendiri ya,terutama yang bercetak tebal pada kode diatas,sedangkan kode jQuerynya sobat bisa download di sini.Semoga artikel Cara Membuat Sudut Halaman Blog Terlipat dan Menggulung (Page Peel jQuery) ini bermanfaat bagi teman-teman disamping saya sendiri juga dari hasil copas sana sini,hihihihihi..keep post guys!












1 komentar:

  1. wiiih manteb tutor ny,.. ane coba ahhh

    http://q-bull.blogspot.com

    BalasHapus