HOME
Sekitar 4 bulan yang lalu saya pernah mempopulerkan iklan bergaya Pagepeel yang ternyata 100% berhasil diaplikasikan pada platform blogger. Nah, PagePeel yang baru kali ini atau kita sebut saja dengan Sexy Curls jQuery Plugin sesuai dengan nama yang diberikan oleh si pembuat kode Elliott Kember memang jauh berbeda dengan yang sebelumnya, dimana Sexy Curls tidak hanya menggunakan standar Javascript tapi diperlukan juga plugin jQuery untuk bisa menjalankan aplikasi ini.
Contoh Sexy Curl bisa anda lihat di agusramadhani.com
Selain itu ada sedikit perbedaan saat anda mengarahkan mouse pada area pagepeel, kalo yang dulu saat mouse diarahkan iklan secara otomatis akan menggulung kebawah, sedangkan yang menggunakan Sexy curls kita harus menarik iklan ini menggunakan mouse secara manual ditandai dengan pointers Diagonal Resize.
Tutorial Cara Pasang (Installasi):
1. Download dulu file
Sexy Curls jQuery Plugin
2. Kemudian Extrack file hasil download .zip atau .rar di
folder anda.
3. Silahkan Edit File turn.js (menggunakan notepad
misalkan)
Note: dalam file
turn.js inilah semua konfigurasi yang anda perlukan. Agar anda tidak
pusing tujuh keliling, saya sertakan saja contoh dari beberapa kemungkinan yang
perlu anda edit. Lihat code yang diedit dengan warna merah.
// Set up the wrapper objects
var turn_hideme = $('<div id="turn_hideme">');
var turn_wrapper = $('<div id="turn_wrapper">');
var turn_object = $('<div id="turn_object">');
var img = $('<img id="turn_fold" src="http://www.domain.com/turn/'+
(options.
http://www.domain.com/turn/
hanya sebagai contoh saja, anda harus sesuaikan sendiri alamatnya.
Pastikan turn.js disimpan dalam folder
/turn
Sebenarnya masih banyak configurasi yang lain, selebihnya dibaca saja ya pada manualnya.
4. Upload semua file yang ada kedalam folder (/turn/) ke hosting milik
anda (pages.google.com
atau geocities.com misalkan)
5. Langkah akhir lakukan pemanggilan javascript, atau dari pada puyeng langsung
copy paste aja kode dibawah ini. jangan lupa mengganti alamat url dibawah
ditandai dengan warna merah dibawah.
<script src='http://www.domain.com/turn/jquery1.3min.js'/>
<script src='http://www.domain.com/turn/jqueryui.js'/>
<script src='http://www.domain.com/turn/turn.js'/>
<link href='http://www.domain.com/turn/turn.css'
rel='stylesheet'/>
<script type='text/javascript'>
$(document).ready(function(){
$('#target').fold();
});
</script>
<img id='target' src='http://www.domain.com/turn/turn/code.png'/>
Letakan kode diatas dibawah kode <head>, atau bisa juga diletakan diatas
kode <b:skin><
Agus Ramadhani memulai kegiatan Blogging sejak tahun 2007 hingga sekarang. Saat ini dia focus sebagai profesional Blogger dan menjadi penulis dibeberapa blog miliknya yang cukup populer diantaranya..
BERI KOMENTAR
Maaf untuk sementara waktu komentar di blog ini di nonaftifkan.