| Filename | Cara Membuat Efek Lipatan Kertas Di Blog |
| Permission | rw-r--r-- |
| Author | Unknown |
| Date and Time | 22.29 |
| Label | Tutorial blog |
| Action |
Mungkin sobat blogger sudah sering melihat efek lipatan kertas ketika
sedang menjelajah website ataupun blogwalking, namun masih bingung
tentang cara pemasangannya di blog... nah kebetulan jika ya berarti
sobat telah mendarat dengan tepat karena pada postingan artikel ini akan
membahas cara pemasangan efek lipatan kertas untuk digunakan di blog.
Oke sob jika tertarik untuk mencoba memasang efek lipatan kertas ini
monggo disimak tutorialnya...
Contoh :
Cara Pemasangan :
- Login ke
blog sobat... - Klik "Design" kemudian klik "Edit HTML" setelah itu klik centang pada "Expand Widget Templates", seperti gambar dibawah ini.
- Cari kode ]]></b:skin> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di atas kode ]]></b:skin> tersebut.
#pageflip {
position: relative;
}
#pageflip img {
border: none;
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
position: absolute;
right: 0; top: 0;
background: url(http://lh3.googleusercontent.com/-BFy8oqoYLgM/T048MJSYmpI/AAAAAAAABO0/RHVBBWIoeSY/s288/Facebook-logo.png)
no-repeat right top;
text-indent: -9999px;
}
- Keterangan :- Kode yang berwarna biru merupakan URL Link Gambar.
- Cari kode </Head> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di atas kode </Head> tersebut.
<script src='http://monozcore-project.googlecode.com/files/script%20page%20peel.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({width: '307px',height: '319px'}, 500);
} , function() {
$("#pageflip img").stop()
.animate({width: '50px',height: '52px'}, 220);
$(".msg_block").stop()
.animate({width: '50px',height: '50px'}, 200);
});
});
</script> - Cari kode <Body> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di bawah kode <Body> tersebut.
<div id='pageflip'>
<a href='http://facebook.com' target='_blank'>
<img alt='' src='http://lh4.googleusercontent.com/-E4pceRFNDIE/T047Qpmfo5I/AAAAAAAABOs/2QTA5duAUg0/s800/sc-page-peel.png'/>
<span class='msg_block'/>
</a>
</div>
- Keterangan :- Kode yang berwarna merah merupakan URL Link yang akan dituju.
- Kode yang berwarna biru merupakan URL Link gambar kertas.
- Klik "Save" dan lihat hasilnya...
1 komentar:
Stainless steel glasses – Top of the line
T-Shirts. All where to buy titanium trim about the titanium bohr model brand that ion chrome vs titanium made mens titanium earrings the iconic titanium bikes glass-like Glass-like Glass-like glass-on-the-wall and “Top of the Line” for over a decade. Made in
Posting Komentar