Salam hangat buat sobat semuanya,kita jumpa lagi dalam artikel baru saya yaitu Cara Membuat Efek Lipatan Buku Pada Halaman Blog,meski ini artikel sudah banyak di bahasdi blog lain namun tidak ada salahnya saya posting kembali karena artikel ini agak sedikit menarik di bandingkan yang lainnya apalagi blog sobat sudah di modifikasi dengan tampilan full css maka akan kelihatan lebih indah seperti yang ada pada blog saya ini....hehehehehe kepedean nih.baiklah buat sobat yang ingnin mencobanya bisa ikuti tutorialnya di bawah ini.
1. Seperti biasa login dulu sob.
2. Pilih menu Template dan pilih Edit HTML.
3. Cari kode <b:skin><![CDATA[,gunakan CTRL+F untuk memudahkan pencarian.
4. Letakan scrip di bawah ini tepat di atas kode <b:skin><![CDATA[
1. Seperti biasa login dulu sob.
2. Pilih menu Template dan pilih Edit HTML.
3. Cari kode <b:skin><![CDATA[,gunakan CTRL+F untuk memudahkan pencarian.
4. Letakan scrip di bawah ini tepat di atas kode <b:skin><![CDATA[
<script src='http://sites.google.com/site/software2iqbalinc/javascript/script_ditunjuk_ngelipet_t4belajarblogger.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({width: '200px',height: '200px'}, 300);
} , function() {
$("#pageflip img").stop()
.animate({width: '50px',height: '52px'}, 220);
$(".msg_block").stop()
.animate({width: '960px',height:'1300px'}, 200);
});
});
</script>
5.Kemudian cari lagi kode ]]><b:skin> dan letak scrip di bawah tepat di atas kode ]]><b:skin>
#pageflip {
position: relative;
}
#pageflip img {
border: none;
width: 200px; height:200px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 100px; height: 100px;
position: absolute;
right: 0; top: 0;
background: url(https://hanscommunity.googlecode.com/files/hans.png) no-repeat right top;
text-indent: 0px;
6. Terakhir cari lagi kode <body> dan letak scrip di bawah kode <body>
<div id='pageflip'>
<a href='http://hansmjlk.blogspot.com' target='_blank'>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0SJr5vHB0_dmmnjnL0D0JTTIClmy6zaQM0hYG4PJSSeXyyOyMqeOBnAlYePIfv_F7i3ZSv-uROptDxvJPq9eHsPUspcVld_GBl4xUMq-p9eZCz2iAQQcdLfAgf-YJK77NcjFG8CyAh-a3/'/>
<span class='msg_block'/>
</a>
</div>
7. Lalu save dan lihat hasilnya.
Demikian tutorial kali ini terima kasih atas semuanya.
Postingan
template blog nya keren bang, download dimana bang??
sip lah oke banget
gan, kok gk ketemu ya " <![CDATA[ " nya?? mohon pencerahannya
hebat gan efekknya... terimaksih atas artikel yang menarik ini..
ditunggu kunjungan baliknya..