How To Add Peel Effect .






Okay. Semua! Sekarang jam menunjukkan 1.52am. ( rajin lak buat tutorial pagi2 buta =.=)

Sekarang AD
nak ajar effect peel. Pendek kata, peel ni mcm mukasurat la senang. Korg bole letak link ape korg suka. Maksudnya blogger korg ada lapisan 1 lg. Paham x? Contoh cm gambar bawah ni :




Mari mula!!
1. Dashboard → Design →  Edit HTML .


2. Tekan Ctrl+F then search tag  </head> .



3. Paste kod kat ATAS </head> 

<style type="text/css">
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(BACKGROUND KORG SENDIRI) no-repeat right top;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"/>
<script type='text/javascript'>
$(document).ready(function(){
//Page Flip on hover
$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});
}); </script>



4. Tekan Ctrl + F3 cari tag <body> .



5. Paste kod kat BAWAH tag <body> .
<div id='pageflip'>
<a href='URL KORANG NAK'><img alt='' src='GAMBAR YANG KORG NAK '/></a>
<div class='msg_block'></div>
</div>
6. Preview dahulu, jika jadi baru klik Save Template.

P/S: Kalau xfaham ape2 boleh tnye AD okay.? I'll be feedback ASAP. Salam .


Thanks for visit! /bye

Sincerely by :

4 comments:

  1. Err. ape yang tak pahamnya? ikut je lah step tu? aku buat boleh je.

    ReplyDelete
  2. emmm,mcm mane nak bg ade 2 mcm cntoh kat atas tuh ? mcm kat atas tuh kan follow n dashboard.. tp aku wat xjd..

    ReplyDelete

© Created by Alep Darling - 2011