Cara Membuat Efek Peel Away dengan Jquery

Cara Membuat Efek Peel Away dengan Jquery -  Kali ini saya akan bagikan tutorial blogger, kalian sudah tau apa itu peel away? Pell Away adalah sebuah efek seperti robekan sampul. Setiap kalia pengunjung blog kita menyentuh pojok kanan atas maka iklan tersembunyi akan muncul. Liat screnshot di bawah jika kalian masih bingung

Cara Membuat Efek Peel Away dengan Jquery

1. Buka Blogger kalian >  Template > Edit HTML

2. Sekarang kalian tekan CTRL + F dan ketik di kotak search ]]></b:skin>

. Copy kode CSS di bawah ini di atas kode tadi.

.admin-bar #PagePeel{top:27px;}
/*Extra 20px height and width to allow for shadow and movement by blog dzulkifli */
#PagePeel{
    height:120px;
    overflow:hidden;
    position:absolute;
    right:0;
    top:0;
    width:120px;
    z-index:9999;
}
#PagePeel svg{
    overflow: hidden;
    position: absolute !important;
    right: 0;
    top: 0;
}
#PagePeel .pointCursor:hover{cursor:pointer;}
#mycontent { position:relative; margin-left:30px; }

3. Setelah itu kalian cari kode </head>
. Jika sudah copy kan kode ini di bawah kode </head> . Anda juga bisa memasang kode ini di HTML/Javasrcipth sesuai kebutuhan anda.

<script type='text/javascript' src='https://googledrive.com/host/0B0WJjcJEFNziazIzXzlhMlhtWlU'></script>
<script type='text/javascript' src='https://googledrive.com/host/0B0WJjcJEFNziMmk4anpFWnRPWHc'></script>
<script type='text/javascript' src='https://googledrive.com/host/0B0WJjcJEFNzidExmT1JpWV9xNmc'></script>
<div id="mycontent">Peel Away Effect By <a href="http://defandaky.blogspot.com">defandaky.blogspot.com</a></div>
<script type='text/javascript'>
/* <![CDATA[ */
var PagePeelProParams = {"smallImageUrl":"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW8yva2PE1ySx44cl0EdOHA48A0QNNIppyJjh5yNWbuC3mSdGfXJYmgpyrqY7L585YgcXSQmB4sxV2kmUXP5N_yZZR-4NLFN2WZDJKknJP-6dC-LihRLdmxOeMWefxFZPLNV3PLozYU5E/s1600/DottedAdvertSmall.png","largeImageUrl":"Gambar anda disini","peelColorStart":"#545454","peelColorEnd":"#cdcdcf","pagePeelTargetUrl":"http://url anda.com","pagePeelActivateEvent":"hover"};
/* ]]> */
</script>

Keterangan :  Kalian ubah tulisan Gambar anda disini dengan link gambar anda dan ubah http://url anda.com dengan link yang ingin di tuju,

DEMO

4. Simpan dan lihat hasilnya.

Sekian postingan dari saya tentang Cara Membuat Efek Peel Away dengan Jquery , jangan lupa untuk menshare artikel ini agar teman teman blogger kalian juga tau tetang efek peel away ini. Jangan lupa untuk terus mengunjungi blog kami untuk mendapatkan update artikel terbaru lainnya.

Cara Membuat Efek Peel Away dengan Jquery